I’m working on my twitch stream project. In attempt to mimic the “online” and “offline” links that pull out from the side, this is what i’m doing:
var shiftOut = function(){
$(this).animate({width:"120px"},500);
};
var shiftIn = function(){
$(this).animate({width:"10px"},500);
}
$(".off-on").on("mouseover",shiftOut);
$(".off-on").on("mouseout", shiftIn);
This is working, but given the time delay, if you mouse on/off before letting the timer run out, the events stack and the div pulls in/out multiple times (see here: https://codepen.io/bdfoz/pen/baYvam?editors=0010 )
I tried using .off() and .stopPropagation(), but i had no success. Any suggestions?