How do I fade in div content on first mouse movement, like on google.com, using JavaScript? I don\'t want it to fade out again.
Using CSS3 animations, for whoever supports it at this point.
body {
opacity: 0;
-webkit-transition: opacity 0.3s linear;
}
In the above example, whenever we change the opacity
on the body, it will do a fade effect lasting 0.3
seconds linearly. Attach it to mousemove for one time only.
document.body.onmousemove = function() {
this.style.opacity = 1;
this.onmousemove = null;
};
See google.com revamped here :) Chrome and Safari only.