Home > Article > Web Front-end > jquery method to achieve gradient switching effect of two pictures_jquery
The example in this article describes how jquery implements the gradient switching effect of two images. Share it with everyone for your reference. The details are as follows:
This code demonstrates how jquery can achieve the effect of gradient switching between two images. It sets a background image for the div with id=kitten, and uses jquery to fade in and out of the div to achieve the gradient switching of the two images
html code
<div id="kitten"> <img src="/images/kitten.jpg" alt="Kitten" /> </div>
jquery code
$("#kitten").hover(function(){ $(this).find("img").fadeOut(); }, function() { $(this).find("img").fadeIn(); });
I hope this article will be helpful to everyone’s jquery programming design.