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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Aug 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Help needed please.

    Hey there again. Would be really grateful again if i could get some help.

    Using the code below.

    I am using a mouse scroll function called rotate, this rotates images in an array through cells, using cell Id's

    I have created two new functions called up() and down() this uses the same code as the function (rotate). The function Up and Down are used by two buttons so that if the user does not have a mouse scroll then they can click the buttons instead.

    I have added extra images to the arrays, the rotate functions works fine still, but the up/down functions stops working when i use more than 6 in the array.

    I think it has something to do with the "document.getElementById" or "(x = 0; x < images.length; x++)" as when i fix the cell that the images rotate through it works fine.

    But im not totally sure why it doesnt works and how to correct it..

    Code:
    var images = new Array()
    var text = new Array()
    var urls = new Array()
    
    images[0] = "Images/Products/a.gif"
    images[1] = "Images/Products/b.gif"
    images[2] = "Images/Products/c.gif"
    images[3] = "Images/Products/d.gif"
    images[4] = "Images/Products/e.gif"
    images[5] = "Images/Products/f.gif"
    images[6] = "Images/Products/g.gif"
    
    text[0] = "Images/Products/4.gif"
    text[1] = "Images/Products/5.gif"
    text[2] = "Images/Products/6.gif"
    text[3] = "Images/Products/7.gif"
    text[4] = "Images/Products/1.gif"
    text[5] = "Images/Products/2.jpg"
    text[6] = "Images/Products/3.gif"
    
    urls[0] = "prod1.html"
    urls[1] = "prod2.html"
    urls[2] = "prod3.html"
    urls[3] = "prod4.html"
    urls[4] = "prod5.html"
    urls[5] = "prod6.html"
    urls[6] = "prod7.html"
    
    
    function rotate(direction)
    
    {if(direction < 0) //down
    	{current_cell = (current_cell + 1)%7;
    	var cc = 6-current_cell;
     	for(x = 0; x < images.length; x++)
    	 
    {var html="<a href='"+urls[(x+cc)%7]+"' onclick='wopen(this.href);return false'><img src='"+images[(x+cc)%7]+"' width='220'" + "height='150' border='0' /></a>";
    	document.getElementById("cell_"+x).innerHTML = html;
    		 
    	var html="<img src='"+text[(x+cc)%7]+"' width='220'" + "height='150' border='0' />";// changing an image/text in cell_5
    	document.getElementById("cell_5").innerHTML = html;
    		}
    	}
    	
     else if(direction > 0) //up
    	{current_cell = (current_cell+6)%7;
    	 var cc = 6- current_cell;
     	 for(x = 0; x < images.length; x++)
    	 
    {var html="<a href='"+urls[(x+cc)%7]+"' onclick='wopen(this.href);return false'><img src='"+images[(x+cc)%7]+"' width='220'" + "height='150' border='0' /></a>";
    	document.getElementById("cell_"+x).innerHTML = html;
    		 
    	var html="<img src='"+text[(x+cc)%7]+"' width='220'" + "height='150' border='0' />"; // changing an image/text in cell_5
    	 document.getElementById("cell_5").innerHTML = html;
    		}
    	}
    }
    
    function down()
    
    	{current_cell = (current_cell + 1)%7;
    	var cc = 6-current_cell;
     	for(x = 0; x < images.length; x++)
    	 
    {var html="<a href='"+urls[(x+cc)%7]+"' onclick='wopen(this.href);return false'><img src='"+images[(x+cc)%7]+"' width='220'" + "height='150' border='0' /></a>";
    	document.getElementById("cell_"+x).innerHTML = html;
    		 
    	var html="<img src='"+text[(x+cc)%7]+"' width='220'" + "height='150' border='0' />";// changing an image/text in cell_5
    	document.getElementById("cell_5").innerHTML = html;
    		}
    	}
    
     function up()
     
    	{current_cell = (current_cell+6)%7;
    	 var cc = 6- current_cell;
     	 for(x = 0; x < images.length; x++)
    	 
    {var html="<a href='"+urls[(x+cc)%7]+"' onclick='wopen(this.href);return false'><img src='"+images[(x+cc)%7]+"' width='220'" + "height='150' border='0' /></a>";
    	document.getElementById("cell_"+x).innerHTML = html;
    		 
    	var html="<img src='"+text[(x+cc)%7]+"' width='220'" + "height='150' border='0' />"; // changing an image/text in cell_5
    	 document.getElementById("cell_5").innerHTML = html;
    		}
    	}
    
    
    </script>
    Any help would be gratefully received.

    Ben

  • #2
    Regular Coder
    Join Date
    Jun 2004
    Posts
    495
    Thanks
    0
    Thanked 82 Times in 80 Posts
    If you have elements with ID's cell_0 through to cell_6 and current_cell has been defined, then the script will function correctly.

  • #3
    New to the CF scene
    Join Date
    Aug 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Aghh thats the thing..I only want to use five cells, for it to cycle through.
    Cell_0 thro to Cell_5, so only 5 of the 6 images are visible at one time.

    What confuses me is that the same code works fine within the Rotate function, i have even tried it with 9 images in the array still cycling through 5 cells and it works perfectly.

    Its just the Up / Down function that doesn't work, and the only difference between the two is that i have separated them out of the If / else option and made them their own function.

  • #4
    Regular Coder
    Join Date
    Jun 2004
    Posts
    495
    Thanks
    0
    Thanked 82 Times in 80 Posts
    Replace all instances of images.length with 6

  • #5
    New to the CF scene
    Join Date
    Aug 2007
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up

    Thanks so much, works a treat...
    Ben


  •  

    Posting Permissions

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