使用画布动画作为背景

我制作了一个我想用于网站背景的翻转动画。我已将画布大小设置为1280 * 800并将其保存为网页。我尝试使用iframe，并让浏览器将其缩放（100％; 100％），但效果不佳。由于正文设置为950px和自动页边距，因此iframe只会与左侧一致，并且iframe不会随着放大/缩小而缩放。使用画布动画作为背景

有没有比使用iframe更好的方法来做到这一点？ PHP还是JS？

我将动画保存为一个单独的网页的原因是因为我觉得我让它有太多的线条（〜1100），基本上有20个左右的翻转动画，我不知道一个更好的方法，除了单独做它们并使用风格来放置它们。

来源

2011-02-28 Lei

请告诉我您的网站地址，以便我可以在我的机器上将其列入黑名单。听起来像它会给我癫痫发作。 – Greg 2011-02-28 16:31:36

请输入密码！你还想达到什么目的？有几件事听起来错了。 – 2011-02-28 16:35:26

您是否在背景中使用画布动画在手机上实现了平滑的动作？ – svassr 2013-11-29 17:24:12

如果我正确理解您的问题，您需要将canvas元素添加到具有#canvasDiv { position:fixed; top:0px; left:0px; z-index:1; }的div层，并提供其他所有其他z-index为2或更大的div。

结帐http://paulirish.com/ 查看了解如何做到这一点的一个很好的代码示例。

来源

2011-02-28 22:35:30 AJMaxwell

谢谢你的实际答案！我已经知道了，实际上这不是问题。我只在背景div上将z-index设置为-1，因为我相信所有其他的默认值都是0。但感谢您的链接，这是另一个帮助我：http://radikalfx.com/2009/10/17/html5-animated-background/ – Lei 2011-03-02 16:26:55

不知道这是否是一个问题，但设置为负面z-index会导致它低于可点击空间。所以如果它是一个交互式的Canvas元素，他们将无法与之交互。只是一句警告:-) – AJMaxwell 2011-03-08 17:47:42

使用画布动画作为背景

回答

相关问题