1 Reply Latest reply on Feb 1, 2010 9:30 PM by 370H55V

    Javascript help!

    m0nkey922

      Hello, my website is www.sated-guild.com  here you will see my menu bar followed by 2 content boxes, and below those 2 you will see 1 huge content area.  I am wanting to input a script for a rotating banner or should I say, rotating content.  Here is the script I am wanting to put.

       

      <script type="text/javascript">
      var imgs1 = new Array("http://img269.imageshack.us/img269/9781/test1zw.jpg","http://img136.imageshack.us/img136/7 831/test2g.jpg","http://img64.imageshack.us/img64/6810/test3m.jpg");
      var lnks1 = new Array("[URL=http://img269.imageshack.us/i/test1zw.jpg/][IMG]http://img269.imageshack.us/img269/9781/te st1zw.jpg[/IMG][/URL]","[URL=http://img136.imageshack.us/i/test2g.jpg/][IMG]http://img136.imageshack.us/img136/7831/tes t2g.jpg[/IMG][/URL]","[URL=http://img64.imageshack.us/i/test3m.jpg/][IMG]http://img64.imageshack.us/img64/6810/test3m .jpg[/IMG][/URL]");
      var alt1 = new Array();
      var currentAd1 = 0;
      var imgCt1 = 3;
      function cycle1() {
        if (currentAd1 == imgCt1) {
          currentAd1 = 0;
        }
      var banner1 = document.getElementById('adBanner1');
      var link1 = document.getElementById('adLink1');
        banner1.src=imgs1[currentAd1]
        banner1.alt=alt1[currentAd1]
        document.getElementById('adLink1').href=lnks1[currentAd1]
        currentAd1++;
      }
        window.setInterval("cycle1()",4000);
      </script>
      <a href=""[URL=http://img269.imageshack.us/i/test1zw.jpg/][IMG]http://img269.imageshack.us/img269/9781/te st1zw.jpg[/IMG][/URL]"" id="adLink1" target="_top">
      <img src="http://img269.imageshack.us/img269/9781/test1zw.jpg" id="adBanner1" border="0" width="500" height="245"></a>

       

       

       

       

       

      Okay, the way I try and do it is I delete the region or the top left box then I insert div tag name it etc where I am able to type in that region.  I then select that region where the typing cursor is in there and I click insert > HTML > Script objects > Script.

       

      From here I have the option of what type? so I pick text/javascript, Source? .. I dont no what this is...and then content is where I type the script or paste then the no script part I leave empty.  From here I see the picture but when I view it and it does not even rotate, and yes I have java script enabled on all my browers!   ANYONE PLEASE HELP been at this for a week I been searching everywhere for tutorials on this ><

        • 1. Re: Javascript help!
          370H55V Level 4

          Insert script object is looking for an external javascript to add a function to the page. Usually a rotating banner is just a simple inline script. You add the code

           

          <SCRIPT LANGUAGE="JavaScript">

           

          <!-- Beginning of JavaScript -

           

          if (document.images) {
          ads = new Array(5);
          ads[0] = "img/banner-1.jpg";
          ads[1] = "img/banner-2.jpg";
          ads[2] = "img/banner-3.jpg";
          ads[3] = "img/banner-5.jpg";
          ads[4] = "img/banner-6.jpg";
          }

           

          newplace = new Array(5);
          newplace[0] = "http://www.site1.com"
          newplace[1] = "http://www.site2.com"
          newplace[2] = "http://www.site3.com"
          newplace[3] = "http://www.site4.com"
          newplace[4] = "http://www.site5.com"

           

          var timer = null
          var     counter = 0

           

          function banner() {
                  timer=setTimeout("banner()", 2500);
                  counter++;
                  if (counter >= 5)
                  counter = 0;
                  document.bannerad.src = ads[counter];
          }

           

          function gothere() {
                  counter2 = counter;
                  window.location.href = newplace[counter2];
          }

           

          // - End of JavaScript - -->
          </SCRIPT>

           

          to the <head> of your page. Then where you want the banner to appear, you add code like this:

           

          <p align="center"><a href="javascript:gothere()"><IMG SRC="img/banner-2.jpg" WIDTH="327" HEIGHT="127" BORDER="0" NAME="bannerad"></a></p>

           

          A few things to remember:

          1. your arrays ALWAYS start with [0] not [1]

          2. images should always be lowercase with no weird characters and no spaces in the name

          3. your newplace array number and the number of links must match the images array.

          4. your if(counter >=    number must match the array number

          5. timer=setTimeout is the delay before image rotation begins (in 1000th's of a second - 2500=2.5 seconds)

          6. you want to start it with the second image in your list to give the page time to load before rotation starts (<IMG SRC="img/banner-2.jpg")