欢迎来到懒人模板!我们专注移动互联网,所有模板永久免费下载!
  • 首 页
  • 当前位置:主页 > 手机js特效 > 悬浮漂浮 >

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

    2014-12-18 22:59 来源/作者:懒人模板 分类:悬浮漂浮  « »

      最近群里有很多懒友多在关注一个问题?就是在做手机建站时候,在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"    这个样式是标记,一定不要删除了。加上去,对原网站样式不会有影响的。

     

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

     

    点击扫描效果预览 免费下载 免登陆网盘下载
    * 懒人模板承诺:本站所有资源免费下载,无病毒,无弹窗,无干扰链接! 提点建议