笔者遇到过2种情况。
背景图的链接出现跨域问题
现象:
背景图链接如果跨域了,部分浏览器(包括Chrome)不显示图片,导致出现一片白板等。
解决:
改用<img src=""/>
标签进行等效处理。
页面有多个动画效果
现象:因为页面有多个动画效果,导致body背景图在苹果手机上,大概率加载不出来,或者只加载中间一部分。
定位出来问题的原因,是动画效果(infinite)影响了背景图的渲染。
当时的解决办法:让所有动画延迟1s播放。
display: inline-block;
animation-delay: 1s