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?
@pseudop, Thanks so much for your suggestion! My 9-to-5 is taking a lot of my time the next few days, but i’m going to give this a shot Sunday afternoon. I’ll let you know how this works out.