宁波网站建设咨询:宁波网站建设
137 8002 6116 宁波网站制作
首页
关于殷雯
网站建设
新闻/观点
网站案例
联系我们
殷雯动态
网站建设常见问答
网络推广
技术交流
PHP技术
你的位置:首页> 新闻/观点 > 网站建设常见问答>网站图片容错代码onerror
网站建设常见问答
网站图片容错代码onerror

网站图片容错代码onerror
有时,img标签中的src图片加载失败,原来的图片位置会出现一个碎片图标,用户体验会下降。
博主现在抛砖引玉,说说自己的解决方案。
通过百度,可以给img标签加背景图片,代码如下:
.headLogo img{
    display: block;
    width: 270px;
    height: 60px;
    background: url(../images/logo.png) no-repeat 0 0;
    margin: 25px 0;
 } 
同时我们想去除载入图片失败时显示在左上角的碎片图标,这个要借用img标签的onerror事件和javascript,img标签支持onerror 事件,在装载文档或图像的过程中如果发生了错误,就会触发onerror事件。可以使用一张提示错误的图片代替显示不了的图片。代码如下:
<img src="images/logo.png" onerror="javascript:this.src='images/logoError.png';">
当图片不存在时,将触发 onerror,而 onerror 中又为 img 指定一个logoError.png
 图片。也就是说图片存在则显示logo.png,图片不存在将显示
logoError.png。
但问题来了,如果logoError.png 也不存在,则继续触发 onerror,导致循环,故会出现打开网页时提示
 Stack overflow at line: 0错误。特别说明:如果图片存在,但网络很不通畅,也可能触发 onerror。

点击:  1087    时间: 2017-12-14
上一条: 客户网站百度排名波动剧烈原因
下一条: thinkphp页面跳转success 和 error
 
 
 
快速通道: 关于我们    网站建设    主机域名    付款方式    我的声明
  
联系我们
手机扫描QQ
网站建设咨询:
咨询热线:
宁波殷雯网站建设工作室
地 址: 浙江省宁波市江东区
电 话: 137 8002 6116 
邮 箱:
330436190@qq.com
宁波网站建设
宁波网站制作
137 8002 6116
宁波殷雯网站建设工作室 版权所有