我想在网页上移动DIV - 换句话说，当点击按钮时，在页面上移动的内容区域（包含文本，图像和其他任意内容）。
每个DIV需要移动一定数量的像素，然后才能移动一定数量的像素。
将会有几个DIV需要彼此独立移动，并且已经定义了z顺序（即“更高”的DIV将能够“移动”到“更低”的DIV，覆盖它们。）
我已经阅读过使用“animate”函数在JQuery中执行此操作，但这显然很慢并且可以使用大量处理器，因为它会驱动频繁的页面重新呈现。
有没有人知道其他任何方式来做这样的事情，比如HTML5或任何激动人心的新技术？也许是纯JavaScript？ ：）
感谢您的建议！
路易丝
答案 0 :(得分：1)
会建议.animate，但你说它很慢。我想知道你从哪里得到的？它可能是几个主要版本之前，特别是IE，但我很久没有看到一个问题。我建议，亲自试试吧。
答案 1 :(得分：0)
您可以使用css3过渡。但它们只适用于现代浏览器 但是使用jquery移动几个div应该在性能方面没有问题。
答案 2 :(得分：0)
它必须是标签吗？如果您严重依赖动画，则应仔细查看HTML5中canvas的一部分
答案 3 :(得分：0)
由于动画是在客户端进行的，因此无论您决定采用何种解决方案，都将依赖于客户端的处理能力。我不知道这样做的任何CSS和/或HTML5功能（Andy提到CSS3），但这只会限制你只使用现代浏览器。
我认为最广泛的选择是JavaScript。您可以自己动手或使用jQuery（或其他一些JavaScript框架）。 jQuery团队非常努力地优化他们的代码，所以我怀疑你可能不会通过自己的代码获得很大的改进。
除非浏览器编写得不好，否则不应导致重新呈现enture页面。虽然这对使用旧版浏览器的客户没有帮助，但较新的浏览器倾向于使用硬件加速进行渲染，因此动画对其系统的影响要小得多。
对不起，我不能给出明确的是/否“这是你应该做的”答案，但我希望这能为你提供一些信息。
答案 4 :(得分：0)
一般来说，我注意到使用css3过渡/转换比使用jquery的.animate更顺畅。这并不是说.animate在大多数情况下并不完美。
如果您使用http://coding.smashingmagazine.com/2011/05/17/an-introduction-to-css3-keyframe-animations/中的关键帧动画
，则可以使用CSS3构建整个内容但大多数浏览器都不支持。所以如果你必须使用css3方法，我会建议一种妥协。您可以在技术上执行以下操作：
1）使用abs定位和左右变化，为你的div（开始，中间和结束）制作三个不同位置的css类。最高价值。
2）在第一个类中添加transition: top 3s linear, left 3s linear;或其他任何内容，以及其他属性的外观。
3）使用javascript动态添加第二个类，使其转换到第二组co-ords
4）使用js观察当co-ords等于第二个状态时，然后添加第三个类，使其转换到第三个位置。或者只是使用计时器添加第三个类。
您必须对css进行一些更改，以确保最后一个应用的类覆盖其他所有内容。为了确保正确的特异性，您可以将类编写为base {}, base.second {} and .base.second.third {}或类似的东西（没有双关语...）
即便如此，只有大多数浏览器的较新版本都支持它，这意味着很多观众都无法获得它。尝试jquery，你可能会感到惊讶。
答案 5 :(得分：0)
我建议你这个链接：http://threedubmedia.com/code/event/drag 尝试演示拖放事件：）
埃里克。