jQuery 动画相对位置（悬停时）错误，

发布于 2024-10-31 11:36:18 字数 590 浏览 0 评论 0原文

每当以下代码在 Chrome 和 FF 中运行（未在其他浏览器中测试）时，"text" 就会如此，如图所示。该脚本应该在 mouseover 上将 "text" 提升 4px，并在 mouseout 上将其返回，

但是当鼠标移入时如下所示的运动，每次将其提升 4px 到最后位置。

$(document).ready(function(){
    $('#n #c a').hover(function(){
        $('span',this).stop(true,true).animate({top:'-=4px'},200);
    },function(){
        $('span',this).stop(true,true).animate({top:'+=4px'},400);
    });
});

按照这些步骤操作，应该很快！

注意：在上图中，文本只是其中之一，其他内容显示为了解目的。你必须快速捕捉到同样的效果。

原文

Whenever the following code is run in Chrome and FF (not tested in other browsers), the "text" goes as such , as in the image.
The script is supposed to lift the "text" 4px above on mouseover and return it back on mouseout

But instead when the mouse is brought in the motion as below, each time it lifts 4px above to its last position.

$(document).ready(function(){
    $('#n #c a').hover(function(){
        $('span',this).stop(true,true).animate({top:'-=4px'},200);
    },function(){
        $('span',this).stop(true,true).animate({top:'+=4px'},400);
    });
});

Follow the steps as such, it should be quick!

NOTE : In above image the text is just one, others are shown for understanding purpose.
You have to be quick to catch the same effect.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

↙厌世 2024-11-07 11:36:18

我认为你可以将鼠标悬停时的顶部设置为-4px，鼠标存在时设置为0px

$(document).ready(function(){
    $('#n #c a').hover(function(){
        $('span',this).stop(true,true).animate({top:'-4px'},200);
    },function(){
        $('span',this).stop(true,true).animate({top:'0px'},400);
    });
});

I think you can just set the top to -4px on hover and 0px when the mouse exists

$(document).ready(function(){
    $('#n #c a').hover(function(){
        $('span',this).stop(true,true).animate({top:'-4px'},200);
    },function(){
        $('span',this).stop(true,true).animate({top:'0px'},400);
    });
});

回复收藏 0 原文

~没有更多了~