网页上不稳定的动画幻灯片背景

发布于 2024-10-23 13:57:35 字数 237 浏览 4 评论 0原文

我正在制作一个带有动画背景的网页。我正在使用 MooTools 交叉淡入淡出一系列大小合适的图像(例如 1100 像素 x 750 像素)。

我认为,由于浏览器必须对这些图像进行大量渲染工作,因此当您使页面全屏时,交叉淡入淡出动画将变得不稳定。

在寻找克服这个问题的方法时,我已经计划用我能找到的最高效的 JavaScript 重写幻灯片。

对于如何让动画背景在大浏览器窗口尺寸下平稳运行,有人有任何其他想法吗?

I'm working on a web page with an animated background. I'm using MooTools to crossfade a series of images that are of a decent size (like 1100px x 750px).

I think since the browser is having to do so much rendering work crossfading these images, when you make the page fullscreen, the crossfade animation will become choppy.

In looking for ways to overcome this, I'm already planning on rewriting the slideshow in the most efficient JavaScript I can muster.

Does anyone have any other ideas on how to have the animated background run smoothly at large browser window sizes?

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

扫码二维码加入Web技术交流群

发布评论

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

评论(2

暗藏城府 2024-10-30 13:57:36

交叉淡入淡出效果非常昂贵,并且在该分辨率下每秒帧数非常低。我会尝试上/下/左/右滑动或擦除效果,而不是交叉淡入淡出。我是 jQuery 工具可滚动插件 的忠实粉丝。

Crossfade effect is expensive and you'll get very low frames per second at that resolution. Instead of a crossfade I'd try a slide up/down/left/right or wipe effect. I'm a big fan of the jQuery tools Scrollable plugin.

通知家属抬走 2024-10-30 13:57:36

正如您自己所说,这可能是一个渲染问题,而不是真正的 JavaScript 速度问题,特别是因为全屏和非全屏之间存在性能差异。

我怀疑优化你的js会有任何实际效果。

AS you said yourself, this is probably a rendering issue, and not really an issue with the speed of your javascript, especially since there is a performance difference between fullscreen and non-fuulscreen.

I doubt optimizing your js will have any real effect.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文