jquery - delay the hover function until after the animation has ceased? -
edit: realize color change happens if user has hovered on text during delay time. how can delay hover function until after animation has ceased?
i not javascript coder, im having trouble figuring out missing here. have 2 divs - sidebar , biotext , behaviour client wants:
both fadein onload, sidebar after bio. after 40 seconds, bio fades 20%, sidebar fades in 80%.
then after bio fades in on hover.
right now, of working except after 40 seconds, bio text flashes dark again 1 second light. im sure simple. thoughts? divs not nested @ all. using jquery/1.9.1/jquery.min.js
http://www.halamufleh.com/about
thanks!
$(document).ready(function () { // fade in content. $('#biotext').fadein(2000).delay(40000).fadeto(5000, 0.20); $('#sidebar').fadeto(4000, .6).delay(40000).fadeto(2000, .8); $("#biotext").hover(function () { $("#biotext").fadeto(1000, 1.0); // sets opacity 100% on hover }, function () { $("#biotext").fadeto(8000, 0.2); // sets opacity 20% on mouseout }); });
i tested site provided, it's working intended. think hover on text , gets messed up, can use old javascript settimeout()
:
$(document).ready(function () { // fade in content. $('#biotext').fadein(2000).delay(40000).fadeto(5000, 0.20); $('#sidebar').fadeto(4000, .6).delay(40000).fadeto(2000, .8); settimeout(function() { $("#biotext").hover(function () { $("#biotext").fadeto(1000, 1.0); // sets opacity 100% on hover }, function () { $("#biotext").fadeto(8000, 0.2); // sets opacity 20% on mouseout }); }, 40000); });
Comments
Post a Comment