用js改变backgroundImage属性,在iphone上测试,每次更换图片都会闪一下。
update:
只有iphone会闪,使用了onload也闪,代码如下
function selection(num0, num1, num2) {
var img = new Image();
img.src = urls[num0][1];
img.onload = function () {
console.log("complete");
selections[num0].style.backgroundImage = "url(" + urls[num0][1] + ")";
list[num0].style.display = "block";
selections[num1].style.backgroundImage = "url(" + urls[num1][0] + ")";
list[num1].style.display = "none";
selections[num2].style.backgroundImage = "url(" + urls[num2][0] + ")";
list[num2].style.display = "none";
}
}
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
因为修改了图片后,新修改的图片没有下载过,所以是空白的
你可以把要修改的图片创建img标签隐藏起来,做个预加载
因为下载图片需要时间,你可以等图片加载完再赋值。
这个问题我也遇到过,很多说法是说跟图片没有预加载有关,但是我之前确确实实是写了预加载的。即使预加载了了这张图片,但是在你更换图片的时候浏览器也有可能会重新请求这张图片。不太确定楼主的问题是否有这个因素在影响,楼主可以测试下。
图片多了?不多的话建议将图片拼成雪碧图,按照帧动画方式来切换图片显示
或者你可以把图片实现按顺序堆叠好,按需显示你想要的
遇到同样的问题了,请问楼主解决了吗?