jQuery:鼠标悬停在背景div“通过”前景工具提示?

时间:2012-10-01 10:43:22

标签: javascript jquery html css

我有一个背景div和一个前景div,当背景被遮住时淡入,并在背景被淘汰时淡出。

但是当前景淡入时,它会从背景中窃取焦点并且工具提示最终会“闪烁”:

http://jsfiddle.net/ts97t/

如何保持工具提示可见并停止闪烁?

由于

1 个答案:

答案 0 :(得分:3)

鼠标悬停在我身上。       这需要保持可见,而不是闪光,直到我鼠标离开绿色方块!     

JQUERY

$("#background").hover(function(){
 $("#tooltip").fadeIn();
},function(){
    $("#tooltip").fadeOut();
   });​

如果你想#tooltip重叠“鼠标悬停在我身上”文字。

#tooltip {
    display: none;
    width: 130px;
    height: 130px;
    background: red;
    top:0;
}

DEMO

第二种方式

   var i=0;
$("#background").hover(function(){
     $("#tooltip").fadeIn();
    },function(){
        if (i==1) {
            $("#tooltip").fadeOut();
i=0;
        } 
    });

$('#tooltip').hover('',function(){
  i=1;

});

HTML

<div id="background">Mouse over me.</div>
<div id="tooltip">This needs to stay visible, and not flash, until I mouse out of the green square!</div>

DEMO 2