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 4 of 4
  1. #1
    New Coder
    Join Date
    Nov 2004
    Posts
    46
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Rotating Banners

    Hi guys.

    I have a webpage with 6 rotating Header Banners. Each one changes after 3 second cycles. I want them to open a new window with their corresponding target destination when each one of these banners is clicked on. I am having trouble trying to get the banners to cycle. Currently, the first banner shows up and clicks to its new window, however, the rest of the banners don't cycle through.

    Can someone please help me get this working properly?

    Thank you.

    The 2 files are shown below..

    === index.html ===

    Code:
    <html>
    <head>
    <title>Southern California Vacation</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="Content-Language" content="EN-US">
    
    <script src="header.js" language="javascript" type="text/javascript"></script>
    
    </head>
    
    <body bgcolor="#CCCCCC" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="window.setTimeout('cycle();',3000);(loadbanners());(urlswitch());">
    
    <a href="http://www.somepage.com" onclick="this.href=urlswitch()" TARGET= "_blank"><img src="/images/advertisers/headerads/adv1003.jpg" width="468" height="60" border="0" name="banner1"></a>
    
    
    </body>
    </html>
    === header.js ===

    Code:
    <!--
    /* Banner Up! - Copyright 1999-2000 By Heidi Allen 
    Knowledge Hound: The How-To Hunter - Learn how to do almost anything...for free!
    Please visit us at http://www.knowledgehound.com
    License for use of this script is granted if and only if
    this entire copyright notice is included with it. We do not provide
    support for this script. It is provided solely as a friendly gesture.
    Use at your own risk. Thanks! */
    // Courtesy of SimplytheBest.net - http://simplythebest.net/scripts/
    var image="";
    var banners=0;
    function cycle() {
      if (++banners > 6) banners=1; // currently set for 6 rotating banners
        loadbanners();
        document.banner1.src = image;
        window.setTimeout('cycle();',3000); // currently set for a new image every 3 seconds
      }
    function loadbanners() {
       if (banners==1)
          {
          image="/images/advertisers/headerads/adv1003.jpg";
          }
       if (banners==2)
          {
          image="/images/advertisers/headerads/adv1004.jpg";
          }
       if (banners==3)
          {
          image="/images/advertisers/headerads/adv1006.jpg";
          }
       if (banners==4)
          {
          image="/images/advertisers/headerads/adv1007.jpg";
          }
       if (banners==5)
          {
          image="/images/advertisers/headerads/adv1008.jpg";
          }
       if (banners==6)
          {
          image="/images/advertisers/headerads/adv1009.jpg";
          }
    }
    //-->
    <!--
    var link = "http://yahoo.com"
    function urlswitch() {
    if (banners==1)
    {
    link = "http://yahoo.com" TARGET= "_blank"; // can change url of every link to its target destination 
    }
    if (banners==2)
    {
    link = "http://disneyland.disney.go.com" TARGET= "_blank";
    }
    if (banners==3)
    {
    link = "http://knotts.com" TARGET= "_blank";
    }
    if (banners==4)
    {
    link = "http://http://www.universalstudioshollywood.com" TARGET= "_blank";
    }
    if (banners==5)
    {
    link = "http://seaworld.com" TARGET= "_blank";
    }
    if (banners==6)
    {
    link = "http://google.com" TARGET= "_blank";
    }
    return link;
    }
    //-->
    
    Last edited by johnnybananas; 10-13-2008 at 11:07 PM.

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,511
    Thanks
    3
    Thanked 504 Times in 491 Posts
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    var ImgeAry1=[['One.gif','URL1.htm'],['Two.gif','URL2.htm'],['Three.gif','URL3.htm']];
    
    function zxcInitBanner(zxcid,zxcary,zxcspd){
     var zxcp=document.getElementById(zxcid);
     if (!zxcp.oop) zxcp.oop=new zxcBannerOOP(zxcp,zxcary,zxcspd);
    }
    
    function zxcBannerOOP(zxcp,zxcary,zxcspd){
     var zxcoop=this;
     zxcp.onmouseover=function(){ zxcoop.stop=true; }
     zxcp.onmouseout=function(){ zxcoop.stop=false; }
     this.p=zxcp;
     this.a=zxcp.parentNode;
     this.path=zxcp.src.substring(0,zxcp.src.lastIndexOf('/')+1);
     this.ary=zxcary;
     this.ary.push([zxcp.src.replace(this.path,''),this.a.href]);
     this.cnt=0;
     this.spd=zxcspd||3000;
     this.to=null;
     this.cng();
     this.stop=false;
    }
    
    zxcBannerOOP.prototype.cng=function(){
     if (!this.stop) {
      this.cnt=++this.cnt%this.ary.length;
      this.p.src=this.path+this.ary[this.cnt][0];
      this.a.href=this.ary[this.cnt][1];
     }
     this.to=setTimeout(function(zxcoop){return function(){zxcoop.cng();}}(this),this.spd);
    }
    
    /*]]>*/
    </script>
    
    </head>
    
    <body onload="zxcInitBanner('tst1',ImgeAry1,3000);zxcInitBanner('tst2',ImgeAry1,1000);" >
    <a href="url0.htm" target="_blank"  onclick="alert(this.href); return false;">
    <img id="tst1" src="http://www.vicsjavascripts.org.uk/StdImages/Zero.gif" width="100" height="100" />
    </a>
    <br />
    <a href="url0.htm" target="_blank"  onclick="alert(this.href); return false;">
    <img id="tst2" src="http://www.vicsjavascripts.org.uk/StdImages/Zero.gif" width="100" height="100" />
    </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 Coder
    Join Date
    Nov 2004
    Posts
    46
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Rotating Banners

    Thanks for the script. I appreciate your help.

    I was finally able to get mine to work though. Heres what it should look like guys. Now time to get the side Skyscraper ones to work..

    === index.html ===

    Code:
    <html>
    <head>
    <title>Southern California Vacation</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="Content-Language" content="EN-US">
    
    <script src="header.js" language="javascript" type="text/javascript"></script>
    
    </head>
    
    <body bgcolor="#CCCCCC" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="window.setTimeout('cycle();',3000);(loadbanners());(urlswitch());">
    
    <a href="http://www.somepage.com" onclick="this.href=urlswitch()" target= "_blank"><img src="/images/advertisers/headerads/adv1003.jpg" width="468" height="60" border="0" name="banner1"></a>
    
    
    </body>
    </html>
    === header.js ===

    Code:
    <!--
    /* Banner Up! - Copyright 1999-2000 By Heidi Allen 
    Knowledge Hound: The How-To Hunter - Learn how to do almost anything...for free!
    Please visit us at http://www.knowledgehound.com
    License for use of this script is granted if and only if
    this entire copyright notice is included with it. We do not provide
    support for this script. It is provided solely as a friendly gesture.
    Use at your own risk. Thanks! */
    // Courtesy of SimplytheBest.net - http://simplythebest.net/scripts/
    var image="";
    var banners=0;
    function cycle() {
      if (++banners > 6) banners=1; // currently set for 6 rotating banners
        loadbanners();
        document.banner1.src = image;
        window.setTimeout('cycle();',3000); // currently set for a new image every 3 seconds
      }
    function loadbanners() {
       if (banners==1)
          {
          image="/images/advertisers/headerads/adv1003.jpg";
          }
       if (banners==2)
          {
          image="/images/advertisers/headerads/adv1004.jpg";
          }
       if (banners==3)
          {
          image="/images/advertisers/headerads/adv1006.jpg";
          }
       if (banners==4)
          {
          image="/images/advertisers/headerads/adv1007.jpg";
          }
       if (banners==5)
          {
          image="/images/advertisers/headerads/adv1008.jpg";
          }
       if (banners==6)
          {
          image="/images/advertisers/headerads/adv1009.jpg";
          }
    }
    //-->
    <!--
    var link = "http://yahoo.com"
    function urlswitch() {
    if (banners==1)
    {
    link = "http://yahoo.com"; // can change url of every link to its target destination 
    }
    if (banners==2)
    {
    link = "http://disneyland.disney.go.com";
    }
    if (banners==3)
    {
    link = "http://knotts.com";
    }
    if (banners==4)
    {
    link = "http://http://www.universalstudioshollywood.com";
    }
    if (banners==5)
    {
    link = "http://seaworld.com";
    }
    if (banners==6)
    {
    link = "http://google.com";
    }
    return link;
    }
    //-->
    

  • #4
    New to the CF scene
    Join Date
    Nov 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Rotating banners: equalizing time display

    I'm relatively new to coding, so sorry if I'm asking stupid questions.

    I used the code below to feature rotating banners on my site & it worked fantastically, so thanks.

    The only problem is that the 1st banner shows for alot longer than the other 2, which show for my specified time of 7 seconds.

    Is this just because of the page load time, and there's nothing I can do to equalise the time display? Or does anyone know how to overcome this?

    Any advice gratefuly received!
    Last edited by nellymelon; 11-04-2008 at 10:25 PM.


  •  

    Posting Permissions

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