Javascript examples for jQuery Method and Property:mouseover
difference between mouseenter mousemove and mouseover
<!DOCTYPE html> <html> <head> <style> div {/*from w w w.j a v a2 s . c om*/ width: 150px; height: 100px; border: 1px solid black; margin: 10px; float: left; padding: 30px; text-align: center; background-color: lightgray; } h3 { background-color: white; } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script> var x = 0; var y = 0; var z = 0; $(document).ready(function(){ $("div.over").mouseover(function(){ $(".over span").text(x += 1); }); $("div.enter").mouseenter(function(){ $(".enter span").text(y += 1); }); $("div.move").mousemove(function(){ $(".move span").text(z += 1); }); }); </script> </head> <body> <div class="over"> <h3>Mouseover event triggered: <span></span></h3> </div> <div class="enter"> <h3>Mouseenter event triggered: <span></span></h3> </div> <div class="move"> <h3>Mousemove event triggered: <span></span></h3> </div> </body> </html>