zoukankan      html  css  js  c++  java
  • Ionic 图片延时加载

    图片的延时加载是为了提供App的运行效率,那么是如何实现的呢?献上github:  https://github.com/paveisistemas/ionic-image-lazy-load

    1.下载ionic-image-lazy-load.js文件,拷贝到我们的lib目录下

    2.在index.html页面中加入js文件引用

    3.设置App依赖的模块

    angular.module('ionicApp', ['ionic', 'ionicLazyLoad'])

    4.在我们的list对象上设置延迟标志

      <ion-content lazy-scroll>
        <ion-refresher pulling-text="下拉" refreshing-text="刷新中..." spinner="ios" on-refresh="doRefreshProduct()"></ion-refresher>
    
        <ion-list can-swipe="true">
          <ion-item ng-repeat="p in productList" class="item-thumbnail-left" ng-click="toEdit($index)">
            <img image-lazy-src="{{p.ImageUrl}}" class="dfimg1"/>
            <h2>
              {{p.Title}}
            </h2>
            <p class="date">
              {{p.CreatedTime}}
            </p>
            <p class="introduction">
              {{p.Content}}
            </p>
            <ion-option-button class="button-assertive" ng-click="toDel($index)">
              删除
            </ion-option-button>
          </ion-item>
        </ion-list>
    
        <p class="tip" style="margin-top:15px;" ng-if="pltip==1">暂无产品</p>
    
        <ion-infinite-scroll ng-if="showScroll" spinner="ios" on-infinite="loadMoreProduct()" immediate-check="true" distance="1%"></ion-infinite-scroll>
    
      </ion-content>

    基本功能就这样,至于其他的延迟效果,需要时再看

  • 相关阅读:
    基于CSS 和JS的网页SELECT下拉框美化,JQUERY 插件
    ini文件读写
    Hibernate 表关系描述之OneToMany
    Hibernate 表关系描述之ManyToMany
    Hibernate 初识
    Hibernate 表关系描述之OneToOne
    Struts配置文件初解
    Hibernate 初识(补充)
    struts 学习之04 "模型"
    (Struts)Action类及其相关类
  • 原文地址:https://www.cnblogs.com/crazyguo/p/6050364.html
Copyright © 2011-2022 走看看