当前位置：首页 → 问答吧 → 求助jquery鼠标滑动信息提示一个BUG，高手帮忙了

求助jquery鼠标滑动信息提示一个BUG，高手帮忙了

时间：2009-04-16

来源：互联网

复制代码

<style>
#showIMG {
width:120px;
}
#showIMG img{
width:100px;
height:100px;
border:#ccc 4px solid;
}
#hidden {
display:none;
position:absolute;
z-index:10;
border:#ccc 4px solid;
}
</style>
<div id="showIMG"><img src="ad.gif" /></div><div id="hidden"></div>
<script>
$("#showIMG").mousemove(function(e){
$("#hidden").html("<img src=\'"+$("#showIMG img").attr('src')+"\' />");
$("#hidden").css({'display':"block",'top': e.clientY , 'left' : e.clientX});
});
$("#showIMG").mouseout(function(){
$("#hidden").html('');
$("#hidden").css('display','none');
});
</script>

哪位高手有空啊，，帮帮我看看，为什么鼠标　滑动　会一闪一闪的

作者: mslove 发布时间: 2009-04-16

首先不知道你准备做到什么效果，是移动的时候出现还是只要鼠标在图片范围都出现。前者的话鼠标不动提示肯定就没了；如果是后者应该要加入一个mouseover事件，不过一段时间后提示还是会在原地闪动，具体原因还不清楚

作者: jokeykiss 发布时间: 2009-04-16

mousemove里不停的修改html怎么行啊，写到mouseover里吧，mousemove里只修改坐标吧

作者: shawphy 发布时间: 2009-04-16

看了楼上shawphy提示，改为
<script type="text/javascript">
    $("#showIMG").mouseenter(function(e) {
        $("#hidden").html("<img src=\'" + $("#showIMG img").attr('src') + "\' />");
        $("#hidden").css({ 'display': "block", 'top': e.clientY, 'left': e.clientX });
    });
    $("#showIMG").mousemove(function(e) {

        $("#hidden").css({ 'display': "block", 'top': e.clientY, 'left': e.clientX });
    });
    $("#showIMG").mouseleave(function() {
        $("#hidden").html('');
        $("#hidden").css('display', 'none');
    });
</script>

就好了

作者: seekarmor 发布时间: 2009-04-16

以楼上代码为准的话，鼠标上移和左移就不会出现一闪闪，一旦右移和下移就一闪一闪的了。
我电脑上装了IE6　IE7　IE8　都　是这样

哦对了，FF　是不管怎么移都　是一闪一闪的

作者: mslove 发布时间: 2009-04-16

加点偏移量吧，一移动，马上就上了到了hidden上了，就算出去了
$("#hidden").css({ 'display': "block", 'top': e.clientY+5, 'left': e.clientX+5 });

作者: shawphy 发布时间: 2009-04-16

还是版主牛，不过这是什么原因造成，真很难理解

作者: mslove 发布时间: 2009-04-17