rubncp rubncp - 1 month ago 5
HTML Question

Autohide a div if any buttons are pressed

I'm making my own video player with an info div on the top and a playbar div in the bottom.

These bars should disappear in 5 seconds if any buttons are pressed and if you press a button these bars should appear (if they are hidden) or stay for 5 seconds more.

At first i thought in something like this

document.onkeyup = function(event) {
showBar('playbarDiv');
showBar('infoDiv');

setTimeout(function() {
hideBar();
}, 5000);

if (hideCounter !== 1){
focusOn('playButton');
hideCounter = 1;
}

};


But of course each time a button is pressed you add a setTimeOut function to the queue, so after 5 seconds the bars starts to hide and show.

I need to avoid this with something like "restart" the SetTimeOut when i press a button instead to "load" a new.

This is a simple example: Demo

Is this possible? or I need to use something different to setTimeOut?

Thanks in advance.

Answer

Yes, it's possible, you can use window.clearTimeout(yourTimeOutVariable) to clear previous timeouts. Check your demo, updated

You can read more about it here http://www.w3schools.com/jsref/met_win_cleartimeout.asp

Comments