鼠标悬停时元素多次淡入/淡出 [英] element fades in/out more than once on mouseover

问题描述

我试图在鼠标悬停时执行一个简单的淡入淡出功能.问题在于，将鼠标悬停在所需项目上然后移出该元素后，该元素会多次淡入和淡出.我在下面包括我的jquery代码以及随附的HTML.任何帮助将不胜感激.谢谢.

I am trying to do a simple fade function on mouseover. The problem is that the element fades in and out more than once after the intended item is moused over and then out. I am including my jquery code below along with the accompanying HTML. Any help would be greatly appreciated. Thanks.

$(document).ready(function(){
        $('.claimfile-text').hide();
        $('.claimfile-graphic').mouseover(function(){
            $('.claimfile-text').fadeIn();
        }).mouseout(function(){
            $('.claimfile-text').fadeOut();
        });

    });

(声明文件)

(悬停显示)

(Claim file)

(hover to reveal)

        <div class="claimfile-text fade-box case-text">
            <p>Claimant</p>
        </div><!-- end claimfile-text -->

推荐答案

为什么不使用:

$(".claimfile-graphic").hover(function(){
  $(".claimfile-text").fadeIn();
}, function(){
  $(".claimfile-text").fadeOut();
});

悬停包含两个事件处理程序-handlerIn和handlerOut. 更多- http://api.jquery.com/hover/

Hover comprises of two event handlers - handlerIn and handlerOut. More - http://api.jquery.com/hover/

这篇关于鼠标悬停时元素多次淡入/淡出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！