jQuery .toggle堆叠样式

Question

我在使用.toggle上下滑动元素时遇到问题，问题是当我尝试将光标快速移到项目上时会弄乱。 元素的id被删除，我得到了jQuery分配的自定义样式。

<div class="ui-effects-wrapper" style="font-size: 100%; border: none; margin: 0px; padding: 0px; width: 160px; height: 60px; float: none; position: relative; z-index: auto; top: -50px; left: auto; bottom: auto; right: auto; overflow: hidden; display: block; background: transparent;">Novi test</div>

我该如何解决？ 我尝试使用.stop，但不能解决问题。 我尝试减少动画时间，但是问题仍然存在。

.js代码

$(document).ready(function(){

$('.journal-entry').hover(function(){
    var name = $(this).attr('name');
    $(this).find('div').stop()
    $(this).find('div').toggle("slide", { direction: "down" }, 200).html(name);
},                        function(){ 
    $(this).find('div').stop();
    $(this).find('div').toggle("slide", { direction: "down" }, 200);
});

});

的HTML

<li class="col-md-3 journal-entry" name="Name of the img">
        <a href="#">
            <img class="journal-img" src="imgsrc">
            <div id="journal-img-title">Novi test</div>
        </a>
</li>

Answer 1

我通过更改选择器并添加一个类来修复它

$('.journal-entry').hover(function(){
    var name = $(this).attr('name');
    $("a",this).children('.titler').toggle("slide", { direction: "down" }, 200).html(name);
},                        function(){ 
    $("a",this).children('.titler').toggle("slide", { direction: "down" }, 200);
});