JavaScript Slideshow Rotator script

We can modify our JavaScript slide show script to show images automatically one after the other at a particular transition interval. Rotation is automatically triggered and user need to click the forward or backward buttons to navigate through the slideshow.

Please read JavaScript image slideshow script before adding this feature.

We will add one setTime function inside our displaynext function. This function will trigger the same displaynext function at an interval of 3 seconds. We can change this value and note that this function setTimeout accepts time duration values in milliseconds. You can read more on this at our JavaScript timer tutorials.

setTimeout("displaynext(1)", 3000); 
Note that all other codes are same as Javascript Slideshow tutorial and you can remove the codes for navigational buttons if required after adding automatic transition to our slideshow. Here is the code of displaynext function with the setTimeout function added.

function displaynext(shift){
present_slide=present_slide + shift;

if(images.length > present_slide && present_slide >= 0){
//document.images[''im''].src = images[present_slide];
document.images[''im''].src = images[present_slide];

var next_slide=present_slide + 1;
download(next_slide); // Download the next image 
setTimeout("displaynext(1)", 3000); 
}


plus2net.com




More on JavaScript Image Object
Image SlideShow Script using navigational buttons
Image Loading to cache while page load by Image object
Reloading the image without refreshing the page
Image Rotator Script for automatic Slideshow
Image Move across by button click
Image Move continuously across screen
Image offSetLeft and offSetTop to get position of the image from left and top
Image Position : Positioning an image by assigning value to style.top and style.left
Image width: Managing width of the image
Image height: managing height of the image
Image align: Image align left or right
Image border: adding and removing border from Image
Image alt: updating or reading alt message of image

Post your comments , suggestion , error , requirements etc here .




We use cookies to improve your browsing experience. . Learn more
HTML MySQL PHP JavaScript ASP Photoshop Articles FORUM . Contact us
©2000-2020 plus2net.com All rights reserved worldwide Privacy Policy Disclaimer