我有一个网络应用程序，它使用外部 CSS 中加载的外部背景图像。现在，可以在图像完全渲染之前使用该应用程序，从而产生奇怪的视觉效果。
如何停止脚本执行直到图像完全加载？
它可以使用普通的 JavaScript 或 jQuery。因为图像是在外部 CSS 中加载的，所以我读到的正常触发器不起作用。
如果你有一个带有背景图像的元素，就像这样
<div id="test" style="background-image: url(link/to/image.png)"><div>
您可以通过获取图像 URL 并将其用于带有 onload 处理程序的 javascript 中的图像对象来等待背景加载
var src = $('#test').css('background-image');
var url = src.match(/\((.*?)\)/)[1].replace(/('|")/g,'');
var img = new Image();
img.onload = function() {
alert('image loaded');
}
img.src = url;
if (img.complete) img.onload();
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
