on mouse over in jquery

On Mouse Over in jQuery#

If you want to add an event to an element when it is hovered over with a mouse, you can use the .hover() method in jQuery. This method takes two functions as arguments - one for when the mouse enters the element, and one for when it leaves the element.

Example Code:#

$(document).ready(function(){
  $("div").hover(
    function(){
      $(this).css("background-color", "yellow");
    },
    function(){
      $(this).css("background-color", "white");
    }
  );
});

In this example, we have a <div> element that will change its background color to yellow when the mouse enters it, and back to white when the mouse leaves it.

Another way to achieve the same effect is by using the .mouseenter() and .mouseleave() methods:

Example Code:#

$(document).ready(function(){
  $("div").mouseenter(function(){
    $(this).css("background-color", "yellow");
  });
  $("div").mouseleave(function(){
    $(this).css("background-color", "white");
  });
});

In this example, we have two separate methods - one for when the mouse enters the element, and one for when it leaves the element. The effect is the same as the previous example, but the code is split into two methods instead of one.