问题
I have got a script which runs a carousel in the site. This is the script which is doing the work. And I need to add a play/pause button in there. User @gskartwii has helped me in here Javascript - How to add a pause button in carousel? to add the button. And I have modified the code to adjust with the design.
The problem is pause is working fine. But once it's paused clicking it again is not resuming the play! I am not an expert on Javascript, so not sure what should I need to cahnge. :/
Can someone please help me on this.
And this is the script:
<?php
$speed = 500;//miliseconds
?>
<script type="text/javascript">
var paused=false;
var timeoutID;
homeTileCount = 1;
$$('.home-tile-container img').each(function(e){
$(e).writeAttribute('id','home-tile-' + homeTileCount);
$(e).addClassName('home-tile');
homeTileCount++;
});
homeTileCount--;
var homeTileRemote = $$('.home-tile-remote')[0];
//play / pause button start
homeTileRemote.insert('<div id="home-title-remote-10" class="overflow"><a href="#" onclick="if(!paused){paused=true} else{paused=false}">| |</a></div>');
//play/pause button end
for (i=homeTileCount;i>=1;i--){
homeTileRemote.insert('<div id="home-tile-remote-'+i+'" class="overflow"><a href="#" onclick="switchTile('+i+');return false">'+i+'</a></div>');
}
function switchTile(n)
{
if(!paused){
//console.log(n);
clearTimeout(timeoutID);
$$('.home-tile-container img').each(function(e){
e.removeClassName('home-tile-active');
});
$$('.home-tile-remote > div').each(function(e){
e.removeClassName('home-tile-remote-active');
});
$('home-tile-remote-'+n).addClassName('home-tile-remote-active');
$('home-tile-'+n).addClassName('home-tile-active');
next = n+1;
if (next > homeTileCount)
next = 1;
timeoutID = setTimeout('switchTile('+next+')', <?=$speed?>);}
}
switchTile(1);
setTimeout('switchTile(2)', <?=$speed?>);
</script>
回答1:
Referencing from other question you asked, if you have a button:
<button type="button" onclick="paused=true;">Pause</button>
then play button should be
<button type="button" onclick="paused=false;">Play</button>
来源:https://stackoverflow.com/questions/12945612/javascript-play-pause-not-working-in-carousel