I have a function that changes slides, I have created a pause and resume functions for it, but when the user presses resume button multiple times, then multiple instances of the script is beeing run and the images change too fast. I need to prevent this from happening.
This is my script in case it might help to make my sentences above to sound less confusing.
/*var image1 = new Image();
image1.src="images/4.jpg";
var image2 = new Image();
image2.src = "images/5.jpg";
var i = 2;
function change(){
i = ((i<=2) ? i : 1);
document.images.slide.src = eval("image"+i+".src");
i++;
setTimeout("change()", 1000);
}
change();
*/
function set_var(){
/*Change these values according to your needs*/
if(typeof(step) == "undefined"){
newElem = document.createElement('img');
linkPause = document.createElement('a');
namePause = document.createTextNode("Pause");
linkPause.appendChild(namePause);
linkPause.setAttribute("onclick", "pause()");
linkPause.style.position = "absolute";
linkResume = document.createElement('a');
nameResume = document.createTextNode("Resume");
linkResume.appendChild(nameResume);
linkResume.setAttribute("onclick", "resume()");
linkPause.style.position = "absolute";
linkResume.style.position = "absolute";
linkResume.style.left = "60px";
slideDiv = document.getElementById('slideshow'); //Name of the division that the slideshow will occur on
slideDiv.appendChild(newElem);
slideDiv.appendChild(linkPause);
slideDiv.appendChild(linkResume);
extention = "jpg";
imgPath = "images/"
numImg = 2; //How many images you want to add in slideshow. Slides start from 1 and are limited with this variable
}
return true;
}
function slide(){
if(set_var()) {
((typeof(step) != "undefined" && step<=numImg) ? step = step : step = 1);
newElem.src = imgPath + step + "." + extention;
step++;
t = setTimeout("slide()", 5000);
}
}
function resume(){
t = setTimeout("slide()",5000);
}
function pause(){
clearTimeout(t);
}