网上找的: 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. Python中的字符串操作总结(Python3.6.1版本)

    Python中的字符串操作(Python3.6.1版本) (1)切片操作: str1="hello world!" str1[1:3] <=> 'el'(左闭右开:即是 ...

  2. Restful --- 让JSON回归单纯

    设计模式才是软件哲学的根本.. 一种软件架构风格.设计风格,而不是标准,只是提供了一组设计原则和约束条件.它主要用于客户端和服务器交互类的软件.基于这个风格设计的软件可以更简洁,更有层次,更易于实现缓 ...

  3. DBA不可不知的操作系统内核参数

    背景 操作系统为了适应更多的硬件环境,许多初始的设置值,宽容度都很高. 如果不经调整,这些值可能无法适应HPC,或者硬件稍好些的环境. 无法发挥更好的硬件性能,甚至可能影响某些应用软件的使用,特别是数 ...

  4. C++构造函数后面的冒号

    构造函数后加冒号是初始化表达式:有四种情况下应该使用初始化表达式来初始化成员:1:初始化const成员2:初始化引用成员3:当调用基类的构造函数,而它拥有一组参数时 4:当调用成员类的构造函数,而它拥 ...

  5. 百度搜索_Selenium WebDriver 环境搭建和错误调试_chromedriver_win32必须下载否则无法测试chrome

    转自:  http://www.360doc.com/content/14/0821/18/597197_403634783.shtml zTree 东西不多,我也一直使用着原始的人工测试手段,随着内 ...

  6. Mastering the game of Go with deep neural networks and tree search浅析

    Silver, David, et al. "Mastering the game of Go with deep neural networks and tree search." ...

  7. CentOS系统中的passwd命令实用技巧小结

    这篇文章主要介绍了Linux系统中的passwd命令实用技巧小结,是Linux入门学习中的基础知识,需要的朋友可以参考下   先来回顾一下passwd命令的基本用法: Linux passwd命令用来 ...

  8. sqlserver 字符串split

    select value from TF_NJVALUES('3C457A2D-188B-4D99-A822-2968054E1FB8,3C457A2D-188B-4D99-A822-2968054E ...

  9. c++ mktime()

    今天联系写一个日历的程序,需要算出月份中的第一天是星期几,用到了mktime()这个函数,感觉这个函数挺有用的,分享给大家. 原型:time_t mktime(struct tm *) 其中的tm结构 ...

  10. win10系统下cmd输入一下安装的软件命令提示拒绝访问解决办法

    问题:win10系统安装了nvm,cmd命令提示不是内部或外部命令 解决:卸载nvm,重新安装,再一次输入nvm,发现正常显示: 问题:win10安装了nvm之后,安装node成功,输入node命令, ...