首页 > 手机js特效 > 悬浮漂浮 > 手机wap建站出现图片没有加载完先显示一个默认加载小图片

手机wap建站出现图片没有加载完先显示一个默认加载小图片

上一篇 下一篇

  最近群里有很多懒友多在关注一个问题?就是在做手机建站时候,在wifi下浏览图片,还好,但是用手机3G网或者2G网时候,加载图片,很慢,就是很大空白,或者直接显示一个叉叉,对用户体验很不好,所以懒友,就想能不能在图片加载出来时候,预先显示一个加载小图片,增加可阅读性。其实很简单,只需要两步就搞定了哈

1、需要一个这样手机特效js:

一键下载:http://www.lanrenmb.com//wap/456/lazyload.zip 

然后在你需要这样效果页面调用:(下面代码直接复制)

<script type="text/javascript" src="template/default/weiju/js/jquery.lazyload.js"></script>
<script type="text/javascript">
$("img.lazy").lazyload();
</script>

2、就是修改调用图片那里代码,那里需要这样显示,就在那里替换下面代码:

<img class="lazy" data-original="/attachment/goods/201407/1405149154xm6ot.jpg"  src="/images/loading.jpg" />

懒人切记分解:

data-original="/attachment/goods/201407/1405149154xm6ot.jpg"   这里是图片真实地址

 src="/images/loading.jpg" /  这里是真是图片没有加载出来显示加载小图片

class="lazy"    这个样式是标记,一定不要删除了。加上去,对原网站样式不会有影响的。

 

是不是很简单哈,希望你能成功哈!

 

模板简介:该模板名称为【手机wap建站出现图片没有加载完先显示一个默认加载小图片】,大小是,文档格式为.,推荐使用打开,作品中的图片,文字等数据均可修改,图片请在作品中选中图片替换即可,文字修改直接点击文字修改即可,您也可以新增或修改作品中的内容,该模板来自用户分享,如有侵权行为请联系网站客服处理。欢迎来懒人模板【悬浮漂浮】栏目查找您需要的精美模板。

  • 下载密码 lanrenmb
  • 下载次数 18,871次
  • 使用软件
  • 文件格式
  • 文件大小
  • 上传时间 12-18
  • 作者 网友投稿
  • 肖像权 人物画像及字体仅供参考
栏目分类 更多 >
  • 焦点图
  • 导航菜单
  • 悬浮漂浮
  • tab标签
  • 前端框架
  • 热门推荐 更多 >
    Bootstrap 响应式 表格式简历模板 自适应 html5 微信公众平台 单页式简历模板 微信模板 企业网站 微信文章
    您可能会喜欢的其他模板