create multiple slide shows in a single webpage using html and javascript

This is sample coding to create two slide show in a same page

<html>
<head>
<script type=”text/javascript”>
var image1=new Image()
image1.src=”sample/images/black-berry.jpg”
var image2=new Image()
image2.src=”sample/images/i-Mate.jpg”
var image3=new Image()
image3.src=”sample/images/lg.jpg”
var test1=new Image()
test1.src=”sample/images/nokia1.jpg”
var test2=new Image()
test2.src=”sample/images/nokia2.jpg”
var test3=new Image()
test3.src=”sample/images/nokia1.jpg”
</script>
</head>
<body>
<img src=”sample/images/black-berry.jpg” name=”slide” width=”100″ height=”300″ />
<img src=”sample/images/nokia1.jpg” name=”slideshow” width=”100″ height=”300″ />
<script>

//variable that will increment through the images
var step=1
function slideit(){
//if browser does not support the image object, exit.
if (!document.images)
return
document.images.slide.src=eval(“image”+step+”.src”)
document.images.slideshow.src=eval(“test”+step+”.src”)
if (step<3)
step++
else
step=1
//call function “slideit()” every 2.5 seconds
setTimeout(“slideit()”,2500)
}
slideit()

</script>
</body>
</html>

 

 

 

 

16 thoughts on “create multiple slide shows in a single webpage using html and javascript

  1. I have been struggling with this for three days now. I was using the function twice instead of just once with the tags. Thank you so much for showing me the error in my own code.

  2. Hey! I’m at work browsing your blog from my new apple iphone! Just wanted to say I love reading through your blog and look forward to all your posts! Carry on the excellent work!

  3. Greetings from Ohio! I’m bored to death at work so I decided to browse your website on my iphone during lunch break. I love the info you present here and can’t wait to take a look when I
    get home. I’m shocked at how fast your blog loaded on my mobile .. I’m not even using WIFI, just 3G .
    . Anyhow, wonderful site!

  4. Tried it but not working. just copied and pasted it and changed the image names and url. but not working. Help! Thank you

    1. Hi Sonia,
      Now copy the code and paste it. Find and replace the double quotes with double quotes in your keyboard. Change the image names and url. Then it will work fine.

  5. Hi there all, here every one is sharing such experience, so it’s pleasant to read this website, and I used to pay a quick visit this web site everyday.

  6. Thank you for the post.
    After a few tweaks, I was able to get it on my page. I was a little rusty, but its like riding a bike.

  7. This helped me so much! Quick question, is there any way to get each picture to link to a webpage? I keep trying how I normally do it with a static image, but it just stops the slides. Also is there a way to make the images fade in? Thank you!

Leave a reply to best online backup app Cancel reply