PDA

View Full Version : Problems with clearInterval()



penguins87
05-01-2010, 02:31 PM
I don't understand what is wrong with my code here. I am making a slideshow for my website. The only problem is when I pause it and play it again, it speeds up. For some reason, clearInterval() does not seem to be doing its job correctly.


function playSlideshow() {
intval = setInterval(next, time);
document.getElementById('play').style.display = "none";
document.getElementById('pause').style.display = "block";
}

function pauseSlideshow() {
clearInterval(intval);
document.getElementById('play').style.display = "block";
document.getElementById('pause').style.display = "none";
}

jscheuer1
05-01-2010, 03:10 PM
That might not be enough code to work from. Does the slide show also have a mouseover pause? Are there any other intervals or timeouts involved in the code anywhere?

Anyways, what you have posted looks OK. It would harm nothing, and perhaps might fix things to add another clearInterval:


function playSlideshow() {
clearInterval(intval);
intval = setInterval(next, time);
document.getElementById('play').style.display = "none";
document.getElementById('pause').style.display = "block";
}

function pauseSlideshow() {
clearInterval(intval);
document.getElementById('play').style.display = "block";
document.getElementById('pause').style.display = "none";
}

vwphillips
05-01-2010, 03:15 PM
works for me IE and FF


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
<script type="text/javascript">
/*<![CDATA[*/

var intval=null;

function next() {
document.Show.Show0.value=vic++;
}
function playSlideshow() {
clearInterval(intval);
intval = setInterval(next, 500);
document.getElementById('play').style.display = "none";
document.getElementById('pause').style.display = "block";
}

function pauseSlideshow() {
clearInterval(intval);
document.getElementById('play').style.display = "block";
document.getElementById('pause').style.display = "none";
}
/*]]>*/
</script></head>

<body>
<input id="play" type="button" name="" value="Play" onclick="playSlideshow();"/>
<input id="pause" type="button" name="" value="Pause" onclick="pauseSlideshow();"/>

<script> vic=0; </script>
<form name=Show id=Show style="position:absolute;visibility:visible;top:420px;left:0px;" >
<input size=100 name=Show0 >
<input size=10 name=Show1 >
<input size=10 name=Show2 >
<input size=10 name=Show3 >
<input size=10 name=Show4 >
<input size=10 name=Show5 >
<input size=10 name=Show6 >
<input size=10 name=Show7 >
<input size=10 name=Show8 >
<input size=10 name=Show9 ><br>
<textarea name=TA rows=1 cols=100 ></textarea>
</form>
</body>

</html>