zoukankan      html  css  js  c++  java
  • 鼠标光标悬停事件

    hove()方法相当于mouseover()与mouseout()事件的组合

    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <title>hover()事件</title>
            <script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script>
            <style type="text/css">
                a {
                    color: #000;
                    text-decoration: none;
                }
                
                ul {
                    list-style: none;
                }
                
                ul li {
                    width: 140px;
                }
                
                #menu_1 {
                    border: 1px dotted #666;
                    border-top: none;
                    padding: 0px 5px 5px 5px;
                }
                
                #menu_1 li {
                    margin: 5px 0px;
                }
                
                li.fli {
                    display: block;
                    float: left;
                    padding: 0px 10px;
                }
            </style>
            <script type="text/javascript">
                $(function(){
                    $("#myaccound").hover(function(){
                        $("#menu_1").css("display","block");
                    },
                        function(){
                            $("#menu_1").css("display","none");
                        }
                    );
                });
            </script>
        </head>
    
        <body>
            <div id="nav">
                <ul>
                    <li class="fli">
                        <a href="#">我的订单</a>
                    </li>
                    <li class="fli" id="myaccound">
                        <a href="#">我的宜美惠▼</a>
                        <ul id="menu_1" style="display:none;">
                            <li>
                                <a href="#">我的优惠券</a>
                            </li>
                            <li>
                                <a href="#">收藏夹</a>
                            </li>
                            <li>
                                <a href="#">短信息</a>
                            </li>
                        </ul>
                    </li>
                    <li class="fli">
                        <a href="#">我网站导航▼</a>
                    </li>
                </ul>
            </div>
        </body>
    
    </html>
  • 相关阅读:
    kubernetes yaml文件格式
    docker 镜像上传至私有仓库
    Docker Compose编排容器
    jenkins+gitlab+ansible+dockerfile+k8s自动发布代码
    kubernetes 命令行
    关于HDFS的读写流程
    vue中watched属性
    app中rem算法
    vue使用中的随笔
    react 表单获取多个input
  • 原文地址:https://www.cnblogs.com/atlj/p/8065529.html
Copyright © 2011-2022 走看看