我想用 jquery 或 JavaScript 预加载两个精灵图像,这些精灵图像在页面完全加载之前不会显示。我已经尝试过这个、这个、这个、这个等等,但它们都不适合我。然而,一个简单的基于 CSS HTML 的解决方案可以工作。但是我有很多页面,所以我不能使用 CSS HTML 解决方案,而是我想使用一些 jquery 解决方案,以便在所有页面都可以访问的单个 .js 文件中工作。
有效的基于 CSS Html 的解决方案。
<div id="preload">
<img src='_ls-global/images/layout-images/layout.png'/>
<img src='_ls-global/images/layout-images/layout2.png'/>
</div>
<style>
#preload{ display: none;}
</style>
由于这个基于 CSS HTML 的解决方案正在运行,我使用 jQuery 实现了它,但它不起作用。
$(window).load(function(){
$("<div/>", {
"id": "preload",
"css": { "display" : "none"},
}).prependTo("body");
$("<img src='_ls-global/images/layout-images/layout.png'/>").appendTo("#preload");
$("<img src='_ls-global/images/layout-images/layout2.png'/>").appendTo("#preload");
});
请提出任何可能的方法来做到这一点。
谢谢。