Method _ jQuery

This article mainly introduces how to create a mouse hover effect based on jQuery. The example analyzes the principle and detailed steps of jQuery to implement mouse effects, which has some reference value, for more information about how to create a hover effect based on jQuery, see the following example. Share it with you for your reference. The specific implementation method is as follows:

1. create HTML:

2. select the. mainnav class:

$(".mainnav").hover( function () { }, function () { });

3. create the imgPath variable and specify the image SRC:

$(".mainnav").hover( function () {  // Grab the source  var imgPath = $(this).attr("src"); }, function () {  // Grab the source  var imgPath = $(this).attr("src");  });

4. find the string off and replace it with on:

$(".mainnav").hover( function () {  // Grab the source  var imgPath = $(this).attr("src");  // Replace the path in the source  $(this).attr("src",imgPath.replace("off", "on")); }, function () {  // Grab the source  var imgPath = $(this).attr("src");  // Replace the path in the source  $(this).attr("src",imgPath.replace("on", "off"));  });

I hope this article will help you with jQuery programming.