When using the CSS "hover" selector, a temporary style is applied to an element, but it's not permanent:
div:hover {
background-color: red;
}
Attempting to achieve the same effect with JavaScript can be more complex and challenging when dealing with multiple elements:
var elem = document.getElementsByTagName("div")[0];
elem.onmouseover = function () {
this.style.backgroundColor = "red";
}
elem.onmouseout = function () {
this.style.backgroundColor = "transparent";
}
Is there a more efficient way to accomplish this? Perhaps something like:
document.getElementsByTagName("div")[0].ontemporarymouseover = function () { // LoL
this.style.backgroundColor = "red";
}
Thank you