CSS :hover works only when mouse moves

Question

I created a very basic sample:

HTML

CSS

#bla {         


        

Answer 1

When you set display to none the image takes up no space meaining there is nowhere to hover over.

I would set the background-image in you css to rgba(0 0 0 0); making it invisible but still in the dom. You can then change your javascript to

setTimeout(function() {
     document.getElementById('bla').style.backgroundColor="green";
},2000);

http://jsfiddle.net/euT7k/3