You are viewing our Forum Archives. To view or take place in current topics click here.
Help with a Javascript banner
Posted:

Help with a Javascript bannerPosted:

wakwakman
  • New Member
Status: Offline
Joined: May 05, 201212Year Member
Posts: 30
Reputation Power: 1
Status: Offline
Joined: May 05, 201212Year Member
Posts: 30
Reputation Power: 1
I am learning Javascript and need help with this. The cycling banner I have makes it appear as though a basket ball is bouncing across part of the screen from left to right. Once it reaches the right side it resets. I need help editing this so once it bounces from left to right, it will bounce backwards from right to left.



    imgArray = new Array(7);
    imgArray[0] = new Image;
    imgArray[0].src = "basketball1.gif";
    imgArray[1] = new Image;
    imgArray[1].src = "basketball2.gif";
    imgArray[2] = new Image;
    imgArray[2].src = "basketball3.gif";
    imgArray[3] = new Image;
    imgArray[3].src = "basketball4.gif";
    imgArray[4] = new Image;
    imgArray[4].src = "basketball5.gif";
    imgArray[5] = new Image;
    imgArray[5].src = "basketball6.gif";
    imgArray[6] = new Image;
    imgArray[6].src = "basketball7.gif";
    index = 0;


    function cycle()
    {
   document.banner.src = imgArray[index].src;
   index++;
   if (index == 7)
   {
      index = 0;
   }
   setTimeout("cycle();", 500);
   return;
    }

<Body onLoad="cycle();">
<Center>
<IMG SRC="Basketball1.gif"
    NAME="banner"
    WIDTH=600
    HEIGHT=375>
</Center>
#2. Posted:
Imp
  • Blind Luck
Status: Offline
Joined: Jan 01, 201113Year Member
Posts: 1,957
Reputation Power: 401
Status: Offline
Joined: Jan 01, 201113Year Member
Posts: 1,957
Reputation Power: 401
This is pretty simple, once your index count is at 7, rather than setting it back to zero, call a second function to reduce the index back to 0.


imgArray = new Array(7);
   imgArray[0] = new Image;
   imgArray[0].src = "basketball1.gif";
   imgArray[1] = new Image;
   imgArray[1].src = "basketball2.gif";
   imgArray[2] = new Image;
   imgArray[2].src = "basketball3.gif";
   imgArray[3] = new Image;
   imgArray[3].src = "basketball4.gif";
   imgArray[4] = new Image;
   imgArray[4].src = "basketball5.gif";
   imgArray[5] = new Image;
   imgArray[5].src = "basketball6.gif";
   imgArray[6] = new Image;
   imgArray[6].src = "basketball7.gif";
   index = 0;
 
 
   function cycle()
   {
  document.banner.src = imgArray[index].src;
  index++;
  if (index == 7)
  {
     setTimeout("cycleback();", 500);
  }
  setTimeout("cycle();", 500);
  return;
   }
 
function cycleback()
   {
  document.banner.src = imgArray[index].src;
  index--;
  if (index == 0)
  {
     setTimeout("cycle();", 500);
  }
  setTimeout("cycleback();", 500);
  return;
   }

 <Body onLoad="cycle();">
 <Center>
 <IMG SRC="Basketball1.gif"
   NAME="banner"
   WIDTH=600
   HEIGHT=375>
 </Center>
Jump to:
You are viewing our Forum Archives. To view or take place in current topics click here.