javascript - JS setTimeout & jQuery function -
i have function , wondering why settimeout not working:
$(document).ready(function() { $('.sliding .text').css("top","130px") $('.sliding').mouseenter(function() { mouseovertimer = settimeout(function() { $(this).find('.text').animate({"top": "0"}, 200); }, 500); }) .mouseleave(function() { $(this).find('.text').delay(500).animate({"top": "130px"}, 400); }); });
i tried wrapping mouseenter event in timeout, didn't seem great idea. want animation on mouseenter work after mouse has been on @ least half second.
alternatively, there better way of doing in jquery?
the this
value inside timeout handler not think it'll be. add explicit variable:
$('.sliding').mouseenter(function() { var self = this; mouseovertimer = settimeout(function() { $(self).find('.text').animate({"top": "0"}, 200); }, 500); })
also should declare "mouseovertimer" local variable outside handler setup code (that is, local variable of "ready" handler) , cancel timeout in "mouseleave" handler:
var mouseovertimer = null; $('.sliding').mouseenter(function() { var self = this; mouseovertimer = settimeout(function() { $(self).find('.text').animate({"top": "0"}, 200); }, 500); }) .mouseleave(function() { $(this).find('.text').delay(500).animate({"top": "130px"}, 400); canceltimeout(mouseovertimer); });
as @ this, i'm pretty sure "mouseleave" code isn't want; think delay unnecessary. i'm not 100% sure want things like, however.
Comments
Post a Comment