Our div #logo is set to 0.8 opacity via css:
background:rgba(50,50,50,0.8)
After a delay, #logo is faded to 0.4 and #main-navigation is animated:
$("#main-navigation").delay(7000).slideUp(1000);
$("#logo").delay(7000).fadeTo(1000,0.4);
When the mouse is moved, #logo is faded to 0.99 and #main-navigation is animated again:
var c;
$(document).on('mousemove',function() {
$("#logo").fadeTo(1000,0.99);
$("#main-navigation").slideDown(1000);
....
Then a timer is set and #logo helpshould be faded back to 0.4 and #main-navigation is animated one final time:
....
clearTimeout(c);
c= setTimeout(function(){
$("#logo").fadeTo(1000,0.4);
$("#main-navigation").slideUp(1000);
}, 2000);
});
Everything works fine EXCEPT for fading #logo back to 0.4.
Any ideas would be greatly appreciated!
Try using
.stop()
If that's not working, please provide a http://www.jsfiddle.net with your relevant code
.stop()