jQuery .toggle stack styles

Question

У меня проблема, когда я использую .toggle для перемещения элементов вверх и вниз, проблема в том, что я пытаюсь быстро передвигать курсор над предметами, которые он перепутал. Идентификатор элемента удаляется, и я получаю настраиваемый стиль, назначенный 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); 
});