<!DOCTYPE htm>
    <html lang=en>
        <meta charset='utf-8'/>
        <head>
            <style type="text/css">
                .small_nav a { display: block; height: 50px; width: 100px; background: red;}
                .small_nav div { width: 300px; height: 300px; background: #eee; display: none;}
            </style>
            <script src="http://code.jquery.com/jquery-latest.js"></script>
            <script type="text/javascript">
                $(document).ready(function(){
                    $('.small_nav a').hover(
                                       function () {
                                        $('.submenu').show(1000);
                                       },function(){
                                        $('.submenu').hide(1000);
                                       }
                                       
                                       );
                    });
            </script>
        </head>
        <body>
            <div class="small_nav">
                <a href="#" ></a>
                <div class="submenu">
                    <ul>
                        <li><a href="#">as</a></li>
                        <li><a href="#">sa</a></li>
                        <li><a href="#">sa</a></li>
                        <li><a href="#">sa</a></li>
                        <li><a href="#">sa</a></li>
                        <li><a href="#">sa</a></li> 
                    </ul> 
                </div>
            </div>    
        </body>
    </html>鼠标迅速移动几次就不显示了? 求高手~~~~!!!!jquery hover()jQueryJavaScript

解决方案 »

  1.   

    好像没有问题。
    你把
    $('.small_nav a')
    改成下面试下
    $('.small_nav > a')
      

  2.   

    .small_nav a
    改为:
    .small_nav
    试一下。
      

  3.   

    改了哦 还是那样 直接写 show()就好了 但是没有效果了。
      

  4.   

    <!DOCTYPE htm>
        <html lang=en>
            <meta charset='utf-8'/>
            <head>
                <style type="text/css">
                    .small_nav a { display: block; height: 50px; width: 100px; background: red;}
                    .small_nav div { width: 300px; height: 300px; background: #eee; display: none;}
                </style>
                <script src="http://code.jquery.com/jquery-latest.js"></script>
                <script type="text/javascript">
                    $(document).ready(function(){
                        $('.small_nav a').mouseenter(
                                             function({$('.submenu').show(1000);})
                                        ).mouseleave(function({$('.submenu').hide(1000);})                                    );                    });
                </script>
            </head>
            <body>
                <div class="small_nav">
                    <a href="#" ></a>
                    <div class="submenu">
                        <ul>
                            <li><a href="#">as</a></li>
                            <li><a href="#">sa</a></li>
                            <li><a href="#">sa</a></li>
                            <li><a href="#">sa</a></li>
                            <li><a href="#">sa</a></li>
                            <li><a href="#">sa</a></li> 
                        </ul> 
                    </div>
                </div>    
            </body>
        </html>这样试试