当前位置:  开发笔记 > 编程语言 > 正文

如何使用jQuery在屏幕上移动div

如何解决《如何使用jQuery在屏幕上移动div》经验,为你挑选了2个好方法。

我需要让多个div在屏幕上从右向左移动,并在它到达边缘时停止.我最近一直在玩jQuery,看起来我想要的就可以用它来完成.有没有人知道我在哪里可以找到这样的例子?



1> Jeremy Ricke..:

您将需要查看jQuery animate()功能.执行此操作的标准方法是绝对定位元素,然后设置"左"或"右"CSS属性的动画.同样流行的方法是增加/减少左边距或右边距.

现在,说到这一点,你需要知道任何类型的动画持续时间超过一两秒的严重性能损失.Javascript根本不是为了处理长,持续,慢的动画.这与为动画的每个"帧"重绘和重新计算DOM元素的方式有关.如果你正在做一个持续时间超过几秒的页面宽度动画,那么预计处理器的峰值会增加50%或更多.如果您使用的是IE6,请准备好让您的计算机自发地燃烧成浏览器无能的火焰球.

要阅读此内容,请查看此主题(从我的第一篇Stackoverflow帖子开始)!

这是animate()功能的jQuery文档的链接:http://docs.jquery.com/Effects/animate



2> Robert Grant..:

在jQuery 1.2及更新版本中,您不再需要绝对定位元素; 您可以使用常规相对定位并使用+ =或 - =来添加或减去属性,例如

$("#startAnimation").click(function(){
    $(".toBeAnimated").animate({ 
        marginLeft: "+=250px",
    }, 1000 );
});

并回应那个回答第一个建议的人:Javascript不具备性能.不要过度使用动画,或者期望在Chrome上的高性能PC上运行良好而快速的东西,以便在运行IE的沼泽标准PC上看起来不错.测试它,并确保它降级很好!

推荐阅读
殉情放开那只小兔子
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有