Javascript Slideshow Tutorial How to make a slideshow in JavaScript

iGuest · December 28, 2009

how to add fading effect and auto running in this slideshowJavascript Slideshow Tutorial

Hi,

I liked this slideshow. But how to add fading images effect and auto run with next previous control in this slideshow.

akkers · December 30, 2009

As soon as I set this up the first thing I did was make it autoplay, it just makes sense. If you haven't already figured it out or given up, here's how it goes:
add two elements:
object.style.display = 'none';

// Show next picture, if last, loop back to front
if (current == last) { current = 1; }
else { current++ }
object = document.getElementById('slide' + current);
object.style.display = 'block';
setTimeout(nextPicture, 2500); //NEW LINE in the end of nextPicture function
} //a self repeating call at a delay of 2.5 secs
//adjust the seconds to your liking

linenums:0'>function nextPicture() { // Hide current picture object = document.getElementById('slide' + current); object.style.display = 'none'; // Show next picture, if last, loop back to front if (current == last) { current = 1; } else { current++ } object = document.getElementById('slide' + current); object.style.display = 'block'; setTimeout(nextPicture, 2500); //NEW LINE in the end of nextPicture function } //a self repeating call at a delay of 2.5 secs //adjust the seconds to your liking(the line which needs to be added should be 24.)

then in line 79 change <body> to:
(it will be 78 if you haven't already made the first change)
<body onload="setTimeout(nextPicture, 2500);">
I'm sure within a day or two I'll get bored with this and make the pictures fade in and out to black and/or white. I'll probably give a how to on that as well.
Let me know if this works for you!

Really good tutorial, But I cant quite figure out the code to make the picture fade out and in when the next button is selected. And i also wanted to add something like 1/4 so the user knows how many images their are in total,

i'm new to all this, does anyone have any ideas?

Thanks

Kam.

iGuest · December 30, 2009

I keep just getting a list of pictures - no slideshowJavascript Slideshow Tutorial

Instead of seeing a slideshow, I keep coming up with a 10 pictures in a line going down the page. What's going on? I've checked the code and it all seems to be right..

Help?!?

-question by Kate

iGuest · January 6, 2010

Fade-In/Fade OutJavascript Slideshow Tutorial

Great tutorial!

Would really like to see this have a couple of options:

Fade-In/Fade Out or Crossfade (or other transition -- of course, simple is the key!)

Thumbnailer (To provide a sort of filmstrip or contact sheet from which user can select)

Fit to screen or Fit Within Defined Area.: A way to "embed" this code into, say, a pre-sized region. The interface changes size and shape based upon the size of each picture. Would like to see, for example, the entire show (filmstrips and all) fit within a "window" of say, 600x450. I could tuck it off to the side and still have other content flowing around it.

ERROR:

However, I'm getting an error of it flipping radically from one image to the next if I click the Next/Previous button(s). It seems to throw the timing off and all hell breaks loose! Anyone else experience this? Is there a fix for it?

Again, excellent work!

-question by DanielNotDan

iGuest · February 1, 2010

Sir, if I may call you sir, are a genius and I can't thank you enough for helping me solve my need for a slideshow... I sincerely hope that you have an awesome year!

Brett

iGuest · February 11, 2010

Loop wonJavascript Slideshow Tutorial

I don't understand what I've done wrong but the loop function refuses to work in the nextpicture and lastpicture functions.

The code is identical to above but after the last slide it just draws a blank page and then hitting previous doesn't bring it back to the last slide and vice versa with going the other direction.

Been puzzling at it for hours and I can't see the problem which probably means its blindingly obvious. Any ideas?

iGuest · February 25, 2010

change the imageJavascript Slideshow Tutorial

Hi,

I need a javascript code to change the image from one image to another by mouse click

for example if a user click over the image the should change to next image.

can u pls help me??

-question by ausmaya

iGuest · September 25, 2010

Can't thank you enough for your tutorial. I really appreciate the explanations. Thanks a million.

iGuest · November 6, 2010

Thanks for the code man.........i really appreciate it............ :blush:

iGuest · November 12, 2010

Hi!Tanks for this scripts.What about the automatic slideshow with description associate to each picture.

iGuest · January 23, 2011

Your post was helpful in showing me how to add a next and previous button to the individual photos for my website photo galleries. My website has 4 photo galleries with thumbnail photos in each gallery. When clicking on an individual thumbnail, an enlarged photo appears along with a menu above it that points to the other photo galleries and a return button, which returns you to the thumbnail photo gallery. I am trying to add a prev and next button to the menu bar for the enlarged photo (rather than having to go back to the thumbnail gallery and then click on each individual thumbnail to view as an enlarged photo). I was somewhat successful using your code where the next and previous buttons appear in the menu bar above the enlarged photo, but not able to get them to advance to the next enlarged photo or return to the previous enlarged photo. Any advice would be appreciated. Thank you.

iGuest · March 11, 2011

Hi, first this was so wonderful and worked beautifully. Thank-you.And This might be a really dumb question, but ... I saved the code as a html page with dreamweaver but I wanted to put the slide show just under my header on the homepage of my site.. do you have any idea how I can go about putting this code into my existing page?If it doesn't make sense dont worry about it. Thanks again for putting this up!

iGuest · March 14, 2011

For anyone having the problem where all your pictures display in a row and then trim themselves down to 1 picture each time the "next" button is clicked...

simply add a function to your script

function hideExtra() {	for ( counter=2; counter<= last; counter++)	{	     object = document.getElementById('slide' + counter);	     object.style.display = 'none';	}}

and then insert

onload="hideExtra();"

into your body tag.

iGuest · May 23, 2011

Great Code.. Some of the best I have seen in a while.. That is really sad knowing that it is fairly simple.. There are just a lot of bad lines of code out there... anyway I am having a few problems.. but I have adjusted the code a little bit...here is the URL if you would like to take a look... http://forums.xisto.com/no_longer_exists/
I am also looking to make the slides click-able where the first one with the credit card will go to Lightbox and show all of the credit cards.. the second and third will go to different pages on the site.Anyway if anyone has any suggestions please let me know. I am a little stuck here and I think it is something easy that I am just not seeing.ThanksScott

iGuest · May 24, 2011

This slide is great... but my website is very dynamic.. I am having problems when I click on the next slide image on the right side of the page it removes the first image but doesn't seem to put up the second or third image.. the code is below..

<html xmlns="http://www.w3.org/1999/xhtml/; xml:lang="en" lang="en"><head><title>Traffic Jam Events</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" /><script type="text/javascript" src="js/prototype.js"></script><script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script><script type="text/javascript" src="js/lightbox.js"></script><script language="JavaScript" type="text/javascript">   //<!--   //<![CDATA[      first = 1;      last = 3;      current = 1;                  function nextPicture() {          // Hide current picture          object = document.getElementById('slide' + current);          object.style.display = 'none';                          // Show next picture, if last, loop back to front          if (current == last) { current = 1; }          else { current++ }          object = document.getElementById('slide' + current);          object.style.display = 'block';		  setTimeout(nextPicture, 4500);       }      function previousPicture() {          // Hide current picture          object = document.getElementById('slide' + current);          object.style.display = 'none';                          if (current == first) { current = last; }          else { current--; }          object = document.getElementById('slide' + current);          object.style.display = 'block';      }	  	  function hideExtra() {        for ( counter=2; counter<= last; counter++)        {             object = document.getElementById('slide' + counter);             object.style.display = 'none';        }}</script><script language="JavaScript" type="text/javascript">	  	  function MM_swapImgRestore() { //v3.0  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;}function MM_preloadImages() { //v3.0  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}}function MM_findObj(n, d) { //v4.01  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);  if(!x && d.getElementById) x=d.getElementById(n); return x;}function MM_swapImage() { //v3.0  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}}</script><style type="text/css">            .slideShow {                background-color: #000000;                text-align: center;                margin-bottom: 0px;                padding: 0px;            }            .slides {                position: relative;                z-index: 1;                display: none;            }            .setTitle, .slideTitle {                font-family: "Franklin Gothic Book", Arial, Helvitica, sans-serif;            }            .setTitle {                color: #995a01;                font-size: 14px;                font-weight: bold;                }            .control {                position: relative;                z-index: 1;            }            #slide1 {                display: block;            }			            img {                border: outset 0px #999999;            }</style><!--Fireworks CS5 Dreamweaver CS5 target.  Created Thu May 19 19:59:49 GMT-0400 (EDT) 2011--></head><body bgcolor="#000000" onload="hideExtra(); MM_preloadImages('images/TrafficJamEventsWebsite519-headerRoll_r1_c2.png','images/TrafficJamEventsWebsite519-headerRoll_r1_c3.png','images/TrafficJamEventsWebsite519-headerRoll_r1_c4.png','images/TrafficJamEventsWebsite519-headerRoll_r1_c5.png','images/TrafficJamEventsWebsite519-headerRoll_r1_c6.png','images/TrafficJamEventsWebsite519-headerRoll_r1_c8.png','images/TrafficJamEventsWebsite519-headerRoll_r1_c9.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r3_c7.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c2.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c5.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c6.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c7.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c8.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c9.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c10.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c2.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c3.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c4.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c6.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c8.png','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c9.png'); initLightbox()"><table width="1000" border="0" align="center" cellpadding="0" cellspacing="0"><!-- fwtable fwsrc="Untitled" fwpage="Page 1" fwbase="TrafficJamEventsWebsite519-header.png" fwstyle="Dreamweaver" fwdocid = "1967789409" fwnested="0" -->  <tr>   <td><img name="TrafficJamEventsWebsite519header_r1_c1" src="images/TrafficJamEventsWebsite519-header_r1_c1.png" width="25" height="60" border="0" id="TrafficJamEventsWebsite519header_r1_c1" alt="" /></td>   <td><a href="http://www.trafficjamevents.com/;'>http://www.trafficjamevents.com/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image50','','images/TrafficJamEventsWebsite519-headerRoll_r1_c2.png',1)"><img src="images/TrafficJamEventsWebsite519-header_r1_c2.png" alt="Home" name="Image50" width="58" height="60" border="0" id="Image50" /></a></td>   <td><a href="http://www.trafficjamevents.com/ SpecialServices; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image51','','images/TrafficJamEventsWebsite519-headerRoll_r1_c3.png',1)"><img src="images/TrafficJamEventsWebsite519-header_r1_c3.png" alt="Special Services" name="Image51" width="128" height="60" border="0" id="Image51" /></a></td>   <td><a href="http://www.trafficjamevents.com/ 
About; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image52','','images/TrafficJamEventsWebsite519-headerRoll_r1_c4.png',1)"><img src="images/TrafficJamEventsWebsite519-header_r1_c4.png" alt="About Traffic Jam Events" name="Image52" width="76" height="60" border="0" id="Image52" /></a></td>   <td><a href="http://forums.xisto.com/no_longer_exists/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image54','','images/TrafficJamEventsWebsite519-headerRoll_r1_c5.png',1)"><img src="images/TrafficJamEventsWebsite519-header_r1_c5.png" alt="Samples of our Work" name="Image54" width="72" height="60" border="0" id="Image54" /></a></td>   <td><a href="http://www.trafficjamevents.com/ 
Contact; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image53','','images/TrafficJamEventsWebsite519-headerRoll_r1_c6.png',1)"><img src="images/TrafficJamEventsWebsite519-header_r1_c6.png" alt="Contact Us" name="Image53" width="99" height="60" border="0" id="Image53" /></a></td>   <td><img name="TrafficJamEventsWebsite519header_r1_c7" src="images/TrafficJamEventsWebsite519-header_r1_c7.png" width="343" height="60" border="0" id="TrafficJamEventsWebsite519header_r1_c7" alt="" /></td>   <td><a href="http://www.americanmarketingassociation.com/rg-erdr.php?_rpo=t; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image61','','images/TrafficJamEventsWebsite519-headerRoll_r1_c8.png',1)"><img src="images/TrafficJamEventsWebsite519-header_r1_c8.png" alt="Check us out on AMA" name="Image61" width="132" height="60" border="0" id="Image61" /></a></td>   <td><a href="http://www.dnb.com/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image62','','images/TrafficJamEventsWebsite519-headerRoll_r1_c9.png',1)"><img src="images/TrafficJamEventsWebsite519-header_r1_c9.png" alt="Dun & Bradstreet accreditation" name="Image62" width="67" height="60" border="0" id="Image62" /></a></td>  </tr></table><table width="1000" border="0" align="center" cellpadding="0" cellspacing="0">  <tr>  <div class="control">   <td><a href="javascript:previousPicture()"><img name="TrafficJamEventsWebsiteSlideCC_r2_c1" src="TrafficJamEventsWebsiteSlideCC_r2_c1.png" width="83" height="294" border="0" id="TrafficJamEventsWebsiteSlideCC_r2_c1" alt="" /></a></td></div>   <td class="slideshow">   <div id="slide1" class="slides">   <div><a href="images/image-1.png" rel="lightbox[CreditCards]" title="my caption"><img name="TJE Custom Credit Cards" src="TrafficJamEventsWebsiteSlideCC_r2_c2.png" width="850" height="294" border="0" id="TrafficJamEventsWebsiteSlideCC_r2_c2" alt="" /></a><a href="images/image-2.png" rel="lightbox[CreditCards]"></a><a href="images/image-3.png" rel="lightbox[CreditCards]"></a><a href="images/image-4.jpg" rel="lightbox[CreditCards]"></a>   </div>   <div id="slide2" class="slides">   <img name="TJE Custom Envelopes" src="TrafficJamEventsWebsiteSlideEnvelopes_r2_c2_s1.png" width="850" height="294" /></div>   <div id="slide3" class="slides">   <img name="TJE Custom" src="TrafficJamEventsWebsiteSlideKey_r2_c2_s1.png" width="850" height="294" /></div></div></td>   <div class="control">   <td><a href="javascript:nextPicture()"><img name="TrafficJamEventsWebsiteSlideCC_r2_c3" src="TrafficJamEventsWebsiteSlideCC_r2_c3.png" width="67" height="294" border="0" id="TrafficJamEventsWebsiteSlideCC_r2_c3" alt="" /></a></td></div>  </tr>                   </table><table width="1000" border="0" align="center" cellpadding="0" cellspacing="0">  <tr>   <td background="images/TrafficJamEventsWebsite519-VideoBG_r2_c1.png" width="1000" height="433" border="0" align="center" valign="middle"><!-- VZAAR START --><div class="vzaar_media_player">      <object id="video" width="576" height="432" type="application/x-shockwave-flash" data="http://view.vzaar.com/776761.flashplayer">'>http://view.vzaar.com/776761.flashplayer">        <param name="movie" value="http://view.vzaar.com/776761.flashplayer">'>http://view.vzaar.com/776761.flashplayer">	        <param name="allowScriptAccess" value="always">        <param name="allowFullScreen" value="true">        <param name="wmode" value="transparent">        <param name="flashvars" value="border=none">        <embed src="http://view.vzaar.com/776761.flashplayer" type="application/x-shockwave-flash" wmode="transparent" width="576" height="432" allowScriptAccess="always" allowFullScreen="true" flashvars="border=none"></embed>        <video width="576" height="432" src="http://view.vzaar.com/776761.mobile" poster="http://view.vzaar.com/776761.image" controls onclick="this.play();"></video></object></div><!-- VZAAR END --></td>   <td><img src="images/spacer.gif" width="1" height="433" border="0" alt="" /></td>  </tr></table><table width="1000" border="0" align="center" cellpadding="0" cellspacing="0"><!-- fwtable fwsrc="Untitled" fwpage="Page 1" fwbase="TrafficJamEventsWebsite519-NewBottom.png" fwstyle="Dreamweaver" fwdocid = "1344842774" fwnested="0" -->  <tr>   <td colspan="11"><img name="TrafficJamEventsWebsite519NewBottom_r2_c1" src="images/TrafficJamEventsWebsite519-NewBottom_r2_c1.png" width="1000" height="366" border="0" id="TrafficJamEventsWebsite519NewBottom_r2_c1" alt="" /></td>   <td><img src="images/spacer.gif" width="1" height="366" border="0" alt="" /></td>  </tr>  <tr>   <td colspan="6"><img name="TrafficJamEventsWebsite519NewBottom_r3_c1" src="images/TrafficJamEventsWebsite519-NewBottom_r3_c1.png" width="592" height="27" border="0" id="TrafficJamEventsWebsite519NewBottom_r3_c1" alt="" /></td>   <td colspan="2"><a href="http://www.trafficjamevents.com/;'>http://www.trafficjamevents.com/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image55','','images/TrafficJamEventsWebsite519-NewBottomRoll_r3_c7.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r3_c7.png" alt="Read More About Traffic Jam Events" name="Image55" width="202" height="27" border="0" id="Image55" /></a></td>   <td colspan="3"><img name="TrafficJamEventsWebsite519NewBottom_r3_c9" src="images/TrafficJamEventsWebsite519-NewBottom_r3_c9.png" width="206" height="27" border="0" id="TrafficJamEventsWebsite519NewBottom_r3_c9" alt="" /></td>   <td><img src="images/spacer.gif" width="1" height="27" border="0" alt="" /></td>  </tr>  <tr>   <td colspan="11"><img name="TrafficJamEventsWebsite519NewBottom_r4_c1" src="images/TrafficJamEventsWebsite519-NewBottom_r4_c1.png" width="1000" height="38" border="0" id="TrafficJamEventsWebsite519NewBottom_r4_c1" alt="" /></td>   <td><img src="images/spacer.gif" width="1" height="38" border="0" alt="" /></td>  </tr>  <tr>   <td><img name="TrafficJamEventsWebsite519NewBottom_r5_c1" src="images/TrafficJamEventsWebsite519-NewBottom_r5_c1.png" width="60" height="21" border="0" id="TrafficJamEventsWebsite519NewBottom_r5_c1" alt="" /></td>   <td colspan="2"><a href="http://www.trafficjamevents.com/ 
copyright; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image56','','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c2.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r5_c2.png" alt="Copyright 2006 Traffic Jam Events" name="Image56" width="260" height="21" border="0" id="Image56" /></a></td>   <td><img name="TrafficJamEventsWebsite519NewBottom_r5_c4" src="images/TrafficJamEventsWebsite519-NewBottom_r5_c4.png" width="110" height="21" border="0" id="TrafficJamEventsWebsite519NewBottom_r5_c4" alt="" /></td>   <td><a href="http://www.trafficjamevents.com/;'>http://www.trafficjamevents.com/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image57','','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c5.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r5_c5.png" alt="Home" name="Image57" width="60" height="21" border="0" id="Image57" /></a></td>   <td><a href="http://www.trafficjamevents.com/ 
SpecialServices; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image58','','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c6.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r5_c6.png" alt="Special Services" name="Image58" width="102" height="21" border="0" id="Image58" /></a></td>   <td><a href="http://www.trafficjamevents.com/;'>http://www.trafficjamevents.com/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image59','','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c7.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r5_c7.png" alt="Need a job..." name="Image59" width="66" height="21" border="0" id="Image59" /></a></td>   <td><a href="http://www.trafficjamevents.com/;'>http://www.trafficjamevents.com/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image60','','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c8.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r5_c8.png" alt="About Traffic Jam Events" name="Image60" width="136" height="21" border="0" id="Image60" /></a></td>   <td><a href="http://forums.xisto.com/no_longer_exists/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image63','','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c9.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r5_c9.png" alt="Samples of our Work" name="Image63" width="67" height="21" border="0" id="Image63" /></a></td>   <td><a href="http://www.trafficjamevents.com/ 
Contact; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image64','','images/TrafficJamEventsWebsite519-NewBottomRoll_r5_c10.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r5_c10.png" alt="Contact Us at Traffic Jam Events" name="Image64" width="72" height="21" border="0" id="Image64" /></a></td>   <td><img name="TrafficJamEventsWebsite519NewBottom_r5_c11" src="images/TrafficJamEventsWebsite519-NewBottom_r5_c11.png" width="67" height="21" border="0" id="TrafficJamEventsWebsite519NewBottom_r5_c11" alt="" /></td>   <td><img src="images/spacer.gif" width="1" height="21" border="0" alt="" /></td>  </tr>  <tr>   <td colspan="11"><img name="TrafficJamEventsWebsite519NewBottom_r6_c1" src="images/TrafficJamEventsWebsite519-NewBottom_r6_c1.png" width="1000" height="33" border="0" id="TrafficJamEventsWebsite519NewBottom_r6_c1" alt="" /></td>   <td><img src="images/spacer.gif" width="1" height="33" border="0" alt="" /></td>  </tr>  <tr>   <td><img name="TrafficJamEventsWebsite519NewBottom_r7_c1" src="images/TrafficJamEventsWebsite519-NewBottom_r7_c1.png" width="60" height="58" border="0" id="TrafficJamEventsWebsite519NewBottom_r7_c1" alt="" /></td>   <td><a href="/?_fb_noscript=1; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image65','','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c2.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r7_c2.png" alt="Find Us on Facebook" name="Image65" width="140" height="58" border="0" id="Image65" /></a></td>   <td><a href="https://mobile.twitter.com/i/nojs_router?path=%2F; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image66','','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c3.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r7_c3.png" alt="Follow us on Twitter" name="Image66" width="120" height="58" border="0" id="Image66" /></a></td>   <td colspan="2"><a href="http://www.stumbleupon.com/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image67','','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c4.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r7_c4.png" alt="Like our site on StumbleUpon" name="Image67" width="170" height="58" border="0" id="Image67" /></a></td>   <td colspan="2"><a href="https://www.google.com/ 
Buzz; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image68','','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c6.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r7_c6.png" alt="Google Buzz" name="Image68" width="168" height="58" border="0" id="Image68" /></a></td>   <td><a href="https://del.icio.us/; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image69','','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c8.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r7_c8.png" alt="We hope you like our site on Delicious" name="Image69" width="136" height="58" border="0" id="Image69" /></a></td>   <td colspan="2"><a href="https://www.google.de/?gfe_rd=cr&ei=BwkjVKfAD8uH8QfckIGgCQ&gws_rd=ssl; onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image70','','images/TrafficJamEventsWebsite519-NewBottomRoll_r7_c9.png',1)"><img src="images/TrafficJamEventsWebsite519-NewBottom_r7_c9.png" alt="Check out our RSS News Feed" name="Image70" width="139" height="58" border="0" id="Image70" /></a></td>   <td><img name="TrafficJamEventsWebsite519NewBottom_r7_c11" src="images/TrafficJamEventsWebsite519-NewBottom_r7_c11.png" width="67" height="58" border="0" id="TrafficJamEventsWebsite519NewBottom_r7_c11" alt="" /></td>   <td><img src="images/spacer.gif" width="1" height="58" border="0" alt="" /></td>  </tr>  <tr>   <td colspan="11"><img name="TrafficJamEventsWebsite519NewBottom_r8_c1" src="images/TrafficJamEventsWebsite519-NewBottom_r8_c1.png" width="1000" height="51" border="0" id="TrafficJamEventsWebsite519NewBottom_r8_c1" alt="" /></td>   <td><img src="images/spacer.gif" width="1" height="51" border="0" alt="" /></td>  </tr></table></body></html>

If you would like to see the site it is located at..

www (dot) Traffic Jam Events (dot) com/NewTestWebsite

Thank you

Any Help would be GREATLY appreciated...

Scott

Sign In

Javascript Slideshow Tutorial How to make a slideshow in JavaScript

Recommended Posts

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Share this post

Link to post

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Important Information