JQuery allows you to move the mouse over an image code instance, while jquery slides over
The jQuery implementation of the mouse slide to switch the Image Code instance:
Sometimes the web page needs such a simple effect, that is, when the mouse slides over the default image, the image can be switched, which may not be so simple in actual application, however, you can expand it by yourself. The following is a brief introduction of the effect.
The static html code is as follows:
<Body> </body>
Jquery switching code:
$ (Document ). ready (function () {var newImage = new Image (); var oldImage = $ ('img '). attr ('src'); newImage. src = 'images/new.jpg '; $ ('img '). hover (function () {$ ('img '). attr ('src', newImage. src) ;}, function () {$ ('img '). attr ('src', oldImage );})})
The above code is the core of switching. The principle is very simple. It is to register a hover event processing function for the image. When the mouse is suspended, modify the src attribute value of the image.
Related reading:
1. For more information about the attr () function, see the attr () method section of jQuery.
2. For details about hover events, see the hover Events section of jQuery.
The original address is: http://www.softwhy.com/forum.php? Mod = viewthread & tid = 9098.
For more information, see: http://www.softwhy.com/jquery/
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
