javascript - how do I pause on hover on a div and continue on mouseout? -
i have set of divs in html document , use jquery show them 1 one after every 15000ms. include links inside of divs want pause or delay div on hover. here script code. can show me how pause on hover?
<script> var ct = 0; function showelem2() { var length = $('.t1').length; $('.t1').hide(); $('.info span').text(ct); $('.t1').eq(ct).fadein(900); (ct >= (length-1)) ? ct = 0: ct++; settimeout(showelem2, 1600); } $(document).ready(function(){ showelem2(); }); </script>
you can clear timeout on mouseover , start again on mouseout. updated code:
var ct = 0; var mytimeout; function showelem2() { var length = $('.t1').length; $('.t1').hide(); $('.info span').text(ct); $('.t1').eq(ct).fadein(900); (ct >= (length-1)) ? ct = 0: ct++; mytimeout = settimeout(showelem2, 1600); } $(document).ready(function(){ showelem2(); // $('div') container want attach mouseover/mouseout event to. $('div').hover(function() { // mouseover cleartimeout(mytimeout); // cancels timeout }, function() { // mouseout mytimeout = settimeout(showelem2, 1600); // starts again (or technically new timeout) }); }); probably not best solution code-wise, key here cleartimeout() let's cancel timeout set settimeout().
Comments
Post a Comment