Maison >interface Web >js tutoriel >Méthode pour créer un effet de survol basé sur jQuery_jquery
L'exemple de cet article décrit comment créer un effet de survol de la souris basé sur jQuery. Partagez-le avec tout le monde pour votre référence. La méthode de mise en œuvre spécifique est la suivante :
1. Créer du HTML :
<ul> <li><a href="/tv"><img src="images/tv_off.gif" class="mainnav"></a></li> </ul>
2. Sélectionnez la classe de .mainnav :
$(".mainnav").hover( function () { }, function () { } );
3. Créez la variable imgPath et spécifiez l'image SRC :
$(".mainnav").hover( function () { // Grab the source var imgPath = $(this).attr("src"); }, function () { // Grab the source var imgPath = $(this).attr("src"); } );
4. Trouvez la chaîne off et remplacez-la par 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")); } );
J'espère que cet article sera utile à la programmation jQuery de chacun.