mouseevent - jQuery countdown pause and repeat -
i'm trying code feature page, i'm not able put pieces :-(
all want simple counter counts 0 , show message (.confirmation). if disrupt (move mouse or touch keyobaord) counter pauses , show different message (.warning) , after few seconds repeat counting begining. ufff...
i've element monitoring user action , conter don't know how add together:
//monitors user action $('.warning, .confirmation').hide(); $(document).bind('mousemove keydown', function() { $('.warning').show().delay(2000).fadeout(500); }); //counts example 5 seconds (this value in <span></span> in html section) var sec = $('#box span').text() var timer = setinterval(function() { $('#box span').text(--sec); if (sec == 0) { $('.confirmation').show(function() { $(document).unbind(); }); clearinterval(timer); } }, 1000);
try that:
//countdown pause timer var countdownpausetimer = 0; //monitors user action $('.warning, .confirmation').hide(); $(document).bind('mousemove keydown', function() { countdownpausetimer = 10; // countdown pause 10 seconds $('.warning').show().delay(2000).fadeout(500); }); //counts example 5 seconds (this value in <span></span> in html section) var sec = $('#box span').text() var timer = setinterval(function() { if (countdownpausetimer > 0) countdownpausetimer--; else $('#box span').text(--sec); if (sec == 0) { $('.confirmation').show(function() { $(document).unbind(); }); clearinterval(timer); } }, 1000); what did here introduce variable indicate pausing countdown , hold number of seconds left pause.
in interval tick check if there pause , decide value decrement...
i didn't test should work.
update
below updated code countdown restarting after pause ends:
//countdown pause timer var countdownpausetimer = -1; //monitors user action $('.warning, .confirmation').hide(); $(document).bind('mousemove keydown', function() { countdownpausetimer = 10; // countdown pause 10 seconds $('.warning').show().delay(2000).fadeout(500); }); //counts example 5 seconds (this value in <span></span> in html section) var sec = $('#box span').text(); var timer = setinterval(function() { if (countdownpausetimer > 0) countdownpausetimer--; else if (countdownpausetimer == 0) { countdownpausetimer--; sec = $('#box span').text(); } else $('#box span').text(--sec); if (sec == 0) { $('.confirmation').show(function() { $(document).unbind(); }); clearinterval(timer); } }, 1000);
Comments
Post a Comment