网上找的: https://github.com/nolimits4web/Swiper/issues/626

var tabsSwiper = new Swiper('#games-content',{
onlyExternal : true,
speed:,
onSlideChangeStart : function(swiper) {
$( ".swiper-slide-active img" ).each(function ( index ) {
var src = $( this ).attr( "data-src" );
$(this).attr("src", src);
$(this).fadeOut().fadeIn();
})
}
}) //Load the First images
$( ".swiper-slide-active img" ).each(function ( index ) {
var src = $( this ).attr( "data-src" );
$(this).attr("src", src);
$(this).fadeOut().fadeIn();
})

自己写的swiper2的延迟加载

var bannerSwiper = new Swiper('.banner_picbox', {
pagination: '.banner_picfocus',
speed: ,
loop: true,
autoplay: ,
paginationClickable: true, // 当Swiper初始化完成
onSwiperCreated: function(swiper){
var current = $(".swiper-slide-active");
var origSrc = current.find("img").attr("src");
var dataSrcnext = current.next().find("img").attr("data-src");
current.next().find("img").attr("src", dataSrcnext);
}, // 当碰触到slider时执行
onSlideChangeStart : function(swiper) {
// $( ".swiper-slide-active img" ).each(function ( index ) {
// var dataSrc = $(this).attr("data-src");
// var origSrc = $(this).attr("src");
// if(dataSrc !== origSrc){
// $(this).attr("src", dataSrc);
// }
// })
var current = $(".swiper-slide-active");
var origSrc = current.find("img").attr("src");
var dataSrc = current.find("img").attr("data-src");
var dataSrcprev = current.prev().find("img").attr("data-src");
var dataSrcnext = current.next().find("img").attr("data-src");
current.find("img").attr("src", dataSrc);
current.prev().find("img").attr("src", dataSrcprev);
current.next().find("img").attr("src", dataSrcnext);
}
})

    bannerWrap.hover(function(){
       bannerSwiper.stopAutoplay();
    },function(){
      bannerSwiper.startAutoplay();
   });

    prev.on("click", function (e) {
e.preventDefault();
bannerSwiper.swipePrev();
}) next.on("click", function (e) {
e.preventDefault();
bannerSwiper.swipeNext();
})

swiper的延迟加载(非官网方法)的更多相关文章

  1. Ubuntu14.04下Mongodb官网安装部署步骤(图文详解)(博主推荐)

    不多说,直接上干货! 在这篇博客里,我采用了非官网的安装步骤,来进行安装.走了弯路,同时,也是不建议.因为在大数据领域和实际生产里,还是要走正规的为好. Ubuntu14.04下Mongodb(离线安 ...

  2. Ubuntu16.04下Mongodb官网安装部署步骤(图文详解)(博主推荐)

    不多说,直接上干货! 在这篇博客里,我采用了非官网的安装步骤,来进行安装.走了弯路,同时,也是不建议.因为在大数据领域和实际生产里,还是要走正规的为好. Ubuntu16.04下Mongodb(离线安 ...

  3. Spring官网下载dist.zip的几种方法

    Spring官网下载dist.zip的几种方法   Spring官网改版后,很多项目的完整zip包下载链接已经隐掉了,虽然Spring旨在引导大家用更“高大上”的maven方式来管理所依赖的jar包, ...

  4. Spring官网jar包下载方法

    Spring官网改版后,很多项目的完整zip包下载链接已经隐掉了,虽然Spring旨在引导大家用更“高大上”的maven方式来管理所依赖的jar包,但是完全没想到中国的国情,在伟大的墙内,直接通过ma ...

  5. Jquery各版本下载,附Jquery官网下载方法

    jQuery version 2.1.1 http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.1.js http://ajax.aspnetcdn.com ...

  6. surface 其实是UEFI与BIOS并存,借用官网的进入方法(少有更改)

    surface 其实是UEFI与BIOS并存,借用官网的进入方法(少有更改) 第一种: 1.       Swipe in from the right edge of the screen, and ...

  7. Spring众多jar包的特点,及Spring jar包官网下载方法

    下面给大家说说spring众多jar包的特点吧,无论对于初学spring的新手,还是spring高手,这篇文章都会给大家带来知识上的收获,如果你已经十分熟悉本文内容就当做一次温故知新吧.spring. ...

  8. 官网下载Git方法

    最近去官网下载Git,奇慢,下到一半直接挂掉,挂VPN也是一样 https://git-scm.com/  今天学到一个方法,下载速度可以达到2m/s,那就是复制下载地址,用迅雷下载,可能是迅雷有P2 ...

  9. 2018年7月份,python上传自己的包库到pypi官网的方法

    最近pypi官网进行了更新,老的上传网址作废了.记录下上传到pypi的方法 0.去pypi官网注册账号,没账号是不可能上传的,想想也是那不乱套了吗,注册后会收到一个邮件需要点击然后重新登录 1.目录就 ...

随机推荐

  1. Oracle分页(limit方式的运用)

    select * from a_matrix_navigation_map where rowid not in(select rowid from a_matrix_navigation_map w ...

  2. wso2as安装

    1.系统环境 Ubuntu12.04    192.168.0.97    root/password找管理员 Ubuntu12.04    192.168.0.99    root/password ...

  3. 释放Ubuntu/Linux系统cache,增加可用内存空间

    某台式机Ubuntu内存共3G,但free的内存只有200M,无法满足scala的jvm需求. 注意用top命令查看才能看到真正的free内存.下面是查看真正内存使用量的另一种命令. watch -n ...

  4. Android XmlPullParser 笔记

    使用XmlPullParser解析xml文件. 要解析的xml文件如下所示. weather.xml <?xml version="1.0" encoding="u ...

  5. C中入栈顺序和运算顺序有关系吗?

    如下代码会怎么执行? printf( "%c,%c,%c\n", getchar(), getchar(), getchar() ); 实际测试,是倒序执行,感觉上符合“C函数的形 ...

  6. WaitForSingleObject()

    参见:http://blog.csdn.net/xiaobai1593/article/details/6672193 1. 格式 DWORD WaitForSingleObject( HANDLE  ...

  7. e1087. try/catch语句

    The try/catch statement encloses some code and is used to handle errors and exceptions that might oc ...

  8. Building a Non-blocking TCP server using OTP principles

    转自:https://erlangcentral.org/wiki/index.php/Building_a_Non-blocking_TCP_server_using_OTP_principles ...

  9. 【Java面试题】16 静态代码块,main方法,构造代码块,构造方法

    public class HelloB extends HelloA{ public HelloB() { System.out.println("HelloB"); } { Sy ...

  10. Linux的缓存内存 Cache Memory详解

    http://www.ha97.com/4337.html PS:前天有童鞋问我,为啥我的Linux系统没运行多少程序,显示的可用内存这么少?其实Linux与Win的内存管理不同,会尽量缓存内存以提高 ...