CSE 154 Examples

In Javascript, when the mouse is over a DOM element, it fires off a "mouseover" event. The "mouseover" event can be caught using addEventListener in our Javascript and we can execute the code we want. In a similar fashion, the mouseout event is triggered when the mouse moves out of the DOM element.

				 
           let div = document.getElementById("change-text");
           div.addEventListener("mouseover", changeText);
           div.addEventListener("mouseout", changeText);

           function changeText() {
             let div = document.getElementById("change-text");
             if(div.innerText == "Changed Text") {
               div.innerText = "Changed text!";
             } else {
               div.innerText = "Hover over me to change my text!";
             }
           }