парения эффект создает мерцающий

Question

Я пытаюсь отобразить параметры на изображении на парении, но когда я парить отображаемые опции продолжает мелькать

 $('a').hover(function(event) { 
     var href = $(this).attr('href'); 
     var top = $(this).next().css("bottom"); 

      $(this).next().css("display", "block"); 
      $(this).next().next().css({ 'top': '30px', 'display': 'block' }); 

    },function() { 
      $(this).next().hide(); 
      $(this).next().next().hide(); 

    }); 

}); 
$('.SelectionAnimate').hover(function() { $(this).css("display", "block"); $(this).next().show(); }); 

код ListView

  <ItemTemplate> 
      <div style="float: left; position: relative; margin: 10px;" > 
       <div> 
        <a class="real" href='<%#"/ProfileTenModified/UserProfile/PhotoCross.aspx?in="+ Eval("Full_Image_Name") +"&mi=" + Eval("User_Id") +"&fd="+ Eval("Album")%>'> 
         <asp:Image ID="Image1" runat="server" ImageUrl='<%#"/ProfileTenModified/setP/"+ Eval("Slide_Thumb_Name") +".JPEG" %>' 
          BorderStyle="Solid" BorderWidth="1px" Width="172px" Height="172px" /> 
        </a> 
        <asp:LinkButton CssClass="SelectionAnimate" ID="Selection" runat="server" Text="Set as Display" 
         OnCommand="ListViewThums_Selection_Command" CommandName="selection"></asp:LinkButton> 
        <asp:LinkButton CssClass="SelectionAnimate" ID="Deletion" runat="server" Text="Remove" 
         OnCommand="ListViewThumbs_Command"></asp:LinkButton> 
       </div> 
       <asp:HiddenField ID="HiddenFieldImageId" runat="server" Value='<%#Eval("Id") %>' /> 
      </div> 
     </ItemTemplate> 

я использовал как mouseenter и hover оба создают одинаковый эффект. чтобы получить возможность отправлять это

Answer 1

Вы используете .hover() только для a. Поэтому, когда вы наведите указатель мыши на a, изображение появится на вашем a, означающем, что вы больше не наведете a. Это вызовет второй обратный вызов .hover(), и изображение исчезнет. Затем снова вы наводите a и повторяете его бесконечно.

Чтобы решить эту проблему, вам просто нужно привязать .hover() к родительскому контейнеру или обоим элементам.

Answer 2

У меня была такая же проблема, как у вас. Итак, для решения этой проблемы я использовал событие mouseenter и mouseleave.

$(selector).on('mouseenter', function(){ 
    //perform what you want whe mouse is on your selector 
}).on('mouseleave', function(){ 
    //your code on when mouse leaves the selector 
});