gpt4 book ai didi

javascript - CSS 背景幻灯片太慢?

转载 作者:太空宇宙 更新时间:2023-11-04 15:27:10 25 4
gpt4 key购买 nike

我正在尝试建立我的网站,我是这方面的新手,但我曾尝试将此代码用于背景幻灯片,不幸的是,加载页面需要很长时间。我已经将 3-500KB 的图像优化为现在的 90-100KB,但仍然需要很长时间才能加载一些...帮助!

My updated version of my site .我正在尝试使用我在网上找到的这些技巧来使其加载速度更快,但我很难让它加载得足够快。

最佳答案

在检查中,您加载的图像似乎太多了,而且一次加载,这使得网站变慢了。

enter image description here

( http://i.stack.imgur.com/xPRxM.png )

您应该使用延迟加载来更快地加载网站,因为这样只会加载所需的图像。

在需要时请求图像(或者可能在需要图像之前一点),但您绝对应该将所有请求放在一起。

其次,你应该有不同尺寸的图片,根据需要准备好,而不是让浏览器去调整图片的大小。浏览器需要花费时间和处理来调整图像大小。如果您有图像的副本,这会让生活变得更简单。

有很多插件可以实现延迟加载。由于您使用的是 jQuery,因此这里有一些:

  1. > http://www.appelsiini.net/projects/lazyload (简单演示 Here )
  2. > http://css-tricks.com/snippets/javascript/lazy-loading-images/
  3. > http://www.google.com/search?q=lazy+loading+jquery

其他提示:

将您所有的脚本合并为一个,并制作一个单一的js文件。

因此,以下内容:

 - <script type="text/javascript" src="js/pop-ups.js"></script>
- <script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
- <script type="text/javascript" src="js/jquery.mousewheel.js"></script>
- <script type="text/javascript" src="js/jquery.jscrollpane.min.js"></script>
- <script type="text/javascript" src="js/cufon.js"></script>

变成<script type="text/javascript" src="js/all.js"></script>

现在,进一步优化,缩小它们。

在线工具很多,但我最喜欢this一个。

另外,我建议你看看 this ,(查看幻灯片 97 之后),Chris Coyier 的演讲。

关于javascript - CSS 背景幻灯片太慢?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13895270/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com