A method to create a mouse hover effect based on jquery _jquery

The example in this article describes how to create a mouse hover effect based on jquery. Share to everyone for your reference. The implementation methods are as follows:

1. Create HTML:

<ul>
<li><a href= "/tv" ></a></li >
</ul>

2. Select the class of. Mainnav:

$ (". Mainnav"). Hover (
 function () {
 },
 function () {
 }
);

3. Set up variable imgpath, specify picture 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 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 your jquery programming.