recherche

Maison >interface Web >js tutoriel >L'événement de souris JS implémente des effets de passage de souris simples

L'événement de souris JS implémente des effets de passage de souris simples

怪我咯
怪我咯original
2017-06-29 10:51:331495parcourir

Cet article présente principalement la méthode d'utilisation des événements de souris pour obtenir des effets de passage de souris simples. Les amis qui en ont besoin peuvent s'y référer

Le code est super simple, il n'y a pas beaucoup de BB ici, présentez-le simplement.

Le code est le suivant :

<!doctype html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>
Document
</title>
    <style type="text/css">
    body,ul,li{margin:0; 
padding
:0; 
list-style
:none}
    ul li{width:100px; height:100px; border:1px solid #f00; float:left; margin:50px 10px; 
background-color
:#ffffff;}
    ul li.current{border:1px solid #dfdfdf; background-color:#ff0000;}
</style>
<script type="text/
javascript
" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
</head>
<body>
    <h1>鼠标经过下面的块</h1>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</body>
</html>
<script type="text/javascript">
    $("ul li").mouseover(function()
    {
         $(this).addClass("current");
    }).mouseout(function()    
    {
        $(this).removeClass("current");        
    });
</script>

C'est un code très simple, amis, veuillez vous y référer et le développer librement, j'espère que vous l'aimerez. il.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Méthode jQuery toggle() très pratiqueArticle suivant：Méthode jQuery toggle() très pratique

Articles Liés

Voir plus