目前我似乎找不到任何可靠的代码,但我想知道(如果可能的话)如何使用 JavaScript 或 JQuery 预加载网页上的所有图像。
可能有一个预加载屏幕或叠加层,在图像被预加载到站点时显示,然后在完成时淡出或消失。任何关于这方面的帮助/指导都会很棒!
谢谢!
目前我似乎找不到任何可靠的代码,但我想知道(如果可能的话)如何使用 JavaScript 或 JQuery 预加载网页上的所有图像。
可能有一个预加载屏幕或叠加层,在图像被预加载到站点时显示,然后在完成时淡出或消失。任何关于这方面的帮助/指导都会很棒!
谢谢!
您可以在页面加载时显示启动屏幕或加载屏幕,然后在 JQuery 告诉您页面已完全加载时删除此屏幕。像这样的东西:
$(document).ready(function() {
// add loader
});
$(window).load(function() {
// remove loader
});
你的意思是加载一组图像(比如画廊?)。如果是这样,那么您可以使用 jQuery 来执行此操作。你检查过 Image Loader 插件吗?看起来它会做你想做的事:
http://www.staticvoid.info/imageLoader/
在运行它之前将一个 div 放在它的顶部,然后在 complete() 回调中删除它是微不足道的。
您可能还想查看这个关于插件的 SO 主题(这将是您的最佳选择,IMO):JQuery 在开始幻灯片之前等待页面完成加载?
This is my preloader. Show preloader first, and when the whole page is loaded, hide preloader and show content. Try this, it's very simple and easy to change. This is link to my blog post with demo and code (~1 Kb): Preload web site using jquery
这将自动为您的网站预加载 CSS 中的所有图像: http ://www.filamentgroup.com/lab/update_automatically_preload_images_from_css_with_jquery/
我认为你不应该有一个加载屏幕,因为这会让你的用户非常恼火。