Question

嗨我想在鼠标移过时滑出一个元素然后将其向后滑动并在鼠标熄灭时隐藏..我有这个代码，但是当鼠标在第一个mouseenter之前离开元素时我有问题功能完成.. .entry_extend div保持可见。我尝试了悬停功能，但是同样的问题......请帮忙......谢谢。

jQuery("document").ready(function(){
                    jQuery(".fire").mouseenter(function(){
                        jQuery(this).children('.entry_extend').stop(true, false).show('slide',null,500,null);

                    });
                    jQuery(".fire").mouseleave(function(){
                        jQuery(this).children('.entry_extend').stop(true, false).hide('slide',null,500,null);
                    });

                });


<div id="craft" class="fire">
       <div class="entry_main">
           <a href="" title="">
             <img src="" alt="" />
            </a>
        </div>
        <div id="entry_ex_craft" class="entry_extend">
           <a href="" title="">original shisha pipe collection</a>
    </div>
 </div>

请帮助：）

Answer 1

您正在尝试实施“悬停”。这有效：

jQuery(".fire").hover(
    function(){jQuery('.entry_extend', this).stop(true, true).show(500);}
    ,
    function(){jQuery('.entry_extend', this).stop(true, true).hide(500);}
);

请注意，让你在DIV中滑入和滑出的DIV并不是一个好主意，因为HIDING DIV会改变包含它的DIV的边界。由于这个原因，你最终可能会有一些“颤抖”的活动。

Answer 2

尝试使用绑定结合mouseover + mouseenter和mouseout + mouseleave ..请参阅here：

jQuery("document").ready(function(){
                    jQuery(".fire").bind('mouseover mousenter',function(){
                        jQuery(this).children('.entry_extend').stop(true, false).show('slide',null,500,null);

                    });
                    jQuery(".fire").bind('mouseout mouseleave',function(){
                        jQuery(this).children('.entry_extend').stop(true, false).hide('slide',null,500,null);
                    });

                });

jQuery悬停问题

2 个答案: