利用jquery 实现hover的div显隐

通常要用到jq的时候这两个抓取对象没有父子级关系,但直接用jquery中的hover事件时,当鼠标移出绑定元素就会执行消失动作,因此:

var timer=0;
$('#sad').hover(function(){
    $('#reply').show();
    },function(){
    timer=setTimeout(function(){
        $('#reply').hide();
    },300);
});
$('#reply').mouseover(function(){
    clearTimeout(timer);
});

这样,执行睡眠给出一点反应时间就能达到效果了

 

以上代码是网上搜的

 

还有一种是用css的hover效果实现的,这个的前提是鼠标移入的div得是显隐div的父级如下:

1 <div class="father">
2     <div class="son">显示/隐藏</div>
3 </div>

这样css中写的是

.father :hover .son{

display:none/block;

}

转载于:https://www.cnblogs.com/gaofeifiy/p/5049191.html