943,683 Members | Top Members by Rank

Ad:
Sep 23rd, 2009
0

looking for code to scroll images

Expand Post »
I am building a website with many images. I am looking for a code that will scroll my images. i am looking for it to show like 3 pics then have arrows on either side so when you clik them (arrows) it will scroll to the next 3 pics. i have only been doing Xhtml and CSS for about 2 years so i am pretty new at this.
Similar Threads
Reputation Points: 10
Solved Threads: 0
Newbie Poster
ryan12193 is offline Offline
3 posts
since Dec 2008
Sep 23rd, 2009
0

Re: looking for code to scroll images

I dont have one, but try google, there are loads of examples out there. You can search for "sroll images script" or "image slideshow"
Reputation Points: 36
Solved Threads: 57
Posting Whiz
Thirusha is offline Offline
355 posts
since Mar 2008
Sep 24th, 2009
0

Re: looking for code to scroll images

Hi Use below Javascript where you want scrolling images in your html page

HTML and CSS Syntax (Toggle Plain Text)
  1. <SCRIPT LANGUAGE="JavaScript">
  2. var interval = 2; // delay between rotating images (in seconds)
  3. var random_display = 0; // 0 = no, 1 = yes
  4. interval *= 1000;
  5.  
  6. var image_index = 0;
  7. image_list = new Array();
  8. image_list = new Array();
  9. image_list[image_index++] = new imageItem("../Images/cdsamples/cd1.jpg"); // Your Image URL here
  10. image_list[image_index++] = new imageItem("../Images/cdsamples/cd2.jpg"); // Your Image URL here
  11. image_list[image_index++] = new imageItem("../Images/cdsamples/cd3.jpg"); // Your Image URL here
  12. image_list[image_index++] = new imageItem("../Images/cdsamples/cd4.jpg"); // Your Image URL here
  13. image_list[image_index++] = new imageItem("../Images/cdsamples/cd5.jpg"); // Your Image URL here
  14. image_list[image_index++] = new imageItem("../Images/cdsamples/cd6.jpg"); // Your Image URL here
  15. image_list[image_index++] = new imageItem("../Images/cdsamples/cd7.jpg"); // Your Image URL here
  16. image_list[image_index++] = new imageItem("../Images/cdsamples/cd8.jpg"); // Your Image URL here
  17. image_list[image_index++] = new imageItem("../Images/cdsamples/cd9.jpg"); // Your Image URL here
  18. image_list[image_index++] = new imageItem("../Images/cdsamples/cd10.jpg"); // Your Image URL here
  19. image_list[image_index++] = new imageItem("../Images/cdsamples/cd12.jpg"); // Your Image URL here
  20. image_list[image_index++] = new imageItem("../Images/cdsamples/cd13.jpg"); // Your Image URL here
  21. image_list[image_index++] = new imageItem("../Images/cdsamples/cd14.jpg"); // Your Image URL here
  22. image_list[image_index++] = new imageItem("../Images/cdsamples/cd15.jpg"); // Your Image URL here
  23. var number_of_image = image_list.length;
  24. function imageItem(image_location) {
  25. this.image_item = new Image();
  26. this.image_item.src = image_location;
  27. }
  28. function get_ImageItemLocation(imageObj) {
  29. return(imageObj.image_item.src)
  30. }
  31. function generate(x, y) {
  32. var range = y - x + 1;
  33. return Math.floor(Math.random() * range) + x;
  34. }
  35. function getNextImage() {
  36. if (random_display) {
  37. image_index = generate(0, number_of_image-1);
  38. }
  39. else {
  40. image_index = (image_index+1) % number_of_image;
  41. }
  42. var new_image = get_ImageItemLocation(image_list[image_index]);
  43. return(new_image);
  44. }
  45. function rotateImage(place) {
  46. var new_image = getNextImage();
  47. document[place].src = new_image;
  48. var recur_call = "rotateImage('"+place+"')";
  49. setTimeout(recur_call, interval);
  50. }
  51. // End -->
  52. </SCRIPT>
Last edited by sreein1986; Sep 24th, 2009 at 12:30 pm.
Reputation Points: 12
Solved Threads: 34
Posting Whiz
sreein1986 is offline Offline
306 posts
since May 2008
Jul 9th, 2010
-1
Re: looking for code to scroll images
Hey - I added the javascript to the page, but it's not working, is there some more code I'm missing, or something else I need to do? please advise
Reputation Points: 10
Solved Threads: 0
Newbie Poster
savageocean is offline Offline
1 posts
since Jul 2010

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in HTML and CSS Forum Timeline: CSS problem
Next Thread in HTML and CSS Forum Timeline: CSS Sprite Current State Issues...





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC