Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    May 2006
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Clickable Slideshow

    I am new to Javascript.

    I am using a clickable slideshow to display banner ads on a website. I followed the directions here: http://www.javascriptkit.com/howto/show2.shtml for writing the code. The example they used only had 3 images, I have 7.

    I have been able to get the 7 images to rotate with any problem, however when I try to make the images clickable I run into problems. The first 3 images work fine but the next 4 are not clickable.

    I am sure that it's something simple, but I can't seem to find it. My code is below:



    <html>
    <head>
    <script type="text/javascript">
    <!--
    var image1=new Image()
    image1.src="/adbanners/joel.jpg"
    var image2=new Image()
    image2.src="/adbanners/scott.gif"
    var image3=new Image()
    image3.src="/adbanners/phishy.jpg"
    var image4=new Image()
    image4.src="/adbanners/awi.gif"
    var image5=new Image()
    image5.src="/adbanners/ic.gif"
    var image6=new Image()
    image6.src="/adbanners/md.jpg"
    var image7=new Image()
    image7.src="/adbanners/pa.jpg"
    </script>
    </head>

    <body>
    <a href="javascript:slidelink()"><img src="http://www.worcreef.org/adbanners/joel.jpg" name="slide" width="468" height="60" /></a>
    <script>
    <!--
    var step=1
    var whichimage=1
    function slideit(){
    if (!document.images)
    return
    document.images.slide.src=eval("image"+step+".src")
    whichimage=step
    if (step<7)
    step++
    else
    step=1
    setTimeout("slideit()",3000)
    }
    slideit()
    function slidelink(){
    if (whichimage==1)
    window.location="http://www.aquariumsetc.com"
    else if (whichimage==2)
    window.location="http://www.justcoral.com"
    else if (whichimage==3)
    window.location="http://www.phishybusiness.com"
    elseif (whichimage==4)
    window.location="http://www.airwaterice.com"
    elseif (whichimage==5)
    window.location="http://www.icecapinc.com"
    elseif (whichimage==6)
    window.location="http://www.marinedepot.com"
    elseif (whichimage==71)
    window.location="http://www.premiumaquatics.com"
    }
    </script>
    </body>
    </html>

    Last edited by ohioreef; 05-08-2006 at 07:00 PM.

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,518
    Thanks
    3
    Thanked 506 Times in 493 Posts
    Code:
    <html>
    <head>
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    
    var image0=new Image()
    image0.src="http://www.worcreef.org//adbanners/joel.jpg"
    var image1=new Image()
    image1.src="http://www.worcreef.org//adbanners/scott.gif"
    var image2=new Image()
    image2.src="http://www.worcreef.org//adbanners/phishy.jpg"
    var image3=new Image()
    image3.src="http://www.worcreef.org//adbanners/awi.gif"
    var image4=new Image()
    image4.src="http://www.worcreef.org//adbanners/ic.gif"
    var image5=new Image()
    image5.src="http://www.worcreef.org//adbanners/md.jpg"
    var image6=new Image()
    image6.src="http://www.worcreef.org//adbanners/pa.jpg"
    
    var ImgAry=[image0.src,image1.src,image2.src,image3.src,image4.src,image5.src,image6.src];
    var LinkAry=["http://www.aquariumsetc.com","http://www.justcoral.com","http://www.phishybusiness.com","http://www.airwaterice.com","http://www.icecapinc.com","http://www.marinedepot.com","http://www.premiumaquatics.com"];
    
    var step=0
    
    function slideit(){
     if (!document.images) return;
     document.getElementById('slide').src=ImgAry[step];
     document.getElementById('link').href=LinkAry[step];
     step=++step%ImgAry.length;
     setTimeout("slideit()",3000)
    }
    
    /*]]>*/
    </script>
    
    </head>
    
    <body onload="slideit();">
    <a id="link" href="#" ><img src="http://www.worcreef.org/adbanners/joel.jpg" id="slide" width="468" height="60" /></a>
    </body>
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #3
    New to the CF scene
    Join Date
    May 2006
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by vwphillips
    Code:
    <html>
    <head>
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    
    var image0=new Image()
    image0.src="http://www.worcreef.org//adbanners/joel.jpg"
    var image1=new Image()
    image1.src="http://www.worcreef.org//adbanners/scott.gif"
    var image2=new Image()
    image2.src="http://www.worcreef.org//adbanners/phishy.jpg"
    var image3=new Image()
    image3.src="http://www.worcreef.org//adbanners/awi.gif"
    var image4=new Image()
    image4.src="http://www.worcreef.org//adbanners/ic.gif"
    var image5=new Image()
    image5.src="http://www.worcreef.org//adbanners/md.jpg"
    var image6=new Image()
    image6.src="http://www.worcreef.org//adbanners/pa.jpg"
    
    var ImgAry=[image0.src,image1.src,image2.src,image3.src,image4.src,image5.src,image6.src];
    var LinkAry=["http://www.aquariumsetc.com","http://www.justcoral.com","http://www.phishybusiness.com","http://www.airwaterice.com","http://www.icecapinc.com","http://www.marinedepot.com","http://www.premiumaquatics.com"];
    
    var step=0
    
    function slideit(){
     if (!document.images) return;
     document.getElementById('slide').src=ImgAry[step];
     document.getElementById('link').href=LinkAry[step];
     step=++step%ImgAry.length;
     setTimeout("slideit()",3000)
    }
    
    /*]]>*/
    </script>
    
    </head>
    
    <body onload="slideit();">
    <a id="link" href="#" ><img src="http://www.worcreef.org/adbanners/joel.jpg" id="slide" width="468" height="60" /></a>
    </body>
    </html>
    If I add new banners, would I just add var image=7 and so on?

  • #4
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,518
    Thanks
    3
    Thanked 506 Times in 493 Posts
    yes and a new link url
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #5
    New to the CF scene
    Join Date
    May 2006
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Can the clicks open a new window? Can the images be shown on a random basis?

  • #6
    New to the CF scene
    Join Date
    May 2006
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I figured out how to get it to open a new window when you click on an ad!!!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •