最近项目首页轮播图用了Swiper轮播,今天突然发现轮播图动画初始正常但是手动换过之后就不动了,解决方法有两种,具体根据采用的情况为准:

1、autoplayDisableOnInteraction:false,

var mySwiper = new Swiper(".swiper-container", {
autoplay: , //可选选项,自动滑动
autoplayDisableOnInteraction:false,
observer: true,
observeParents: true,
paginationClickable: true,
watchSlidesProgress: true,
watchSlidesVisibility: true
});

当autoplayDisableOnInteraction:false的时候,手动滑动自动滑动不会失效

2、网上最多的:disableOnInteraction:false,

var mySwiper = new Swiper(".swiper-container", {
autoplay: {
delay: ,
disableOnInteraction: false,
},
observer: true,
observeParents: true,
paginationClickable: true,
watchSlidesProgress: true,
watchSlidesVisibility: true
});

话不多说,其实只是写法不用,属性作用一样。

Swiper轮播手动后不动的更多相关文章

  1. Swiper轮播隐藏再显示后不动

    公告用Swiper轮播方式,在某些不需要显示公告的页面进行隐藏,在需要展示公告的页面进行显示时候,公告不能正常轮播,在条件里加入重新设置轮播方法等网上的一些方法仍然不行,最后解决方法: this.my ...

  2. 视频swiper轮播

    关于本次文章的内容,实际上是咪咕阅读详情页中的一个前端需求要做的效果,不过比起原需求,此次案例已经被删减掉许多部分了.音频部分舍弃,调用客户端接口舍弃,并做一些整理.最后留下的是这个精简版的案例.方便 ...

  3. swiper轮播问题之一:轮播图内容为动态数据生成时轮播图无法自动轮播

    本人在用H5做移动端项目中使用Swiper遇到的两个问题,因此加深了对Swiper的掌握,分享出来对刚开始接触Swiper的童鞋们或多或少会有帮助.        首先,new Swiper的初始化最 ...

  4. 使用Swiper轮播插件引起的探索

    提到Swiper轮播插件,小伙伴们应该不会感到陌生.以前我主要在移动端上使用,PC端使用较少. 注:这里需要注意的是,在PC端和移动端使用Swiper是不同的 官方给的版本有三个,分别是Swiper2 ...

  5. Vue以CDN方式调用Swiper轮播异常

    问题概览: 有一个小型单页应用项目,嫌用组件式调用vue-swiper麻烦,因此以CDN的方式调用swiper,结果轮播的图不动了! 爬了半天百度和谷歌都无解决方案,最后曲线救国的方式解决了问题. 解 ...

  6. swiper轮播在ie浏览器上遇到的显示问题探索

    前言: 最近项目有一个需求,想要下图效果,鼠标指向头像图片,图片会放大同时上面的轮播会跟着切换: 鼠标移开头像图片,图片变回原来的大小 注:下图是我根据上面需求已经实现的效果,所以截图方便说明 思考: ...

  7. swiper轮播图(逆向自动切换类似于无限循环)

    swiper插件轮播图,默认的轮播循序是会从右向左,第一张,第二张,第三张,然后肉眼可见是的从第三张从左到右倒回第一张,这样就会有些视觉体验不高, ,不过还是能够用swiper本身的特性更改成无限循环 ...

  8. Swiper轮播图

    今天咱们来说一下.Swiper轮播图. 超级简单的: 翠花,上代码:   <!DOCTYPE html>   <html lang="en">   < ...

  9. 微信小程序_(组件)swiper轮播图

    微信小程序swiper轮播图组件官方文档 传送门 Learn: swiper组件 一.swiper组件 indicator-dots:是否显示面板指示点[默认值false] autoplay:是否自动 ...

随机推荐

  1. IBM公司的面试题,看看你能做出多少。

    进入IBM差不多是每一个IT人的梦想.IBM公司向来以高素质人才作为企业持续竞争力的保证,所以经常出一些千奇百怪的面试题,来考验一个人的综合能力,以下是5道IBM曾经出过的面试题,看看你能作出几道:  ...

  2. 32. Longest Valid Parentheses (JAVA)

    Given a string containing just the characters '(' and ')', find the length of the longest valid (wel ...

  3. AsyncDisplayKit

    Facebook发布了其iOS UI框架AsyncDisplayKit(ASDK)1.0正式版,这个框架被用于Facebook自家的应用Paper中,能够提高UI的流畅性并缩短响应时间. 下载和使用 ...

  4. Docker数据目录相关操作

    数据目录挂载 我们可以在创建容器的时候,将宿主机的目录与容器内的目录进行映射,这样我们就可以通过修改宿主机某个目录的文件从而去影响容器.使用 -v 选项 docker run -id -v /宿主机绝 ...

  5. c语言之ascii字符

    int main(){ char buf[20] = {104,101,108,108,111,0}; printf("buf:%s\n",buf); return 0;} 打印结 ...

  6. 八、ARM 汇编程序格式和程序控制

    8.1 汇编程序格式 源程序中的语句可以分为两种类型:指令性语句.指示性语句 指示性语句就是一些伪操作,在 MDK 编译环境下的伪操作有下面几种: 符号定义伪操作 数据定义伪操作 汇编控制伪操作 其他 ...

  7. 路径path知识点

    1. 获取当前文件的路径 test.py os.path.abspath(path) # 返回当前文件运行的绝对路径 print("程序的绝对路径是",os.path.abspat ...

  8. Vue-搭建环境

    项目开发完react-native,因为又对vue开始感兴趣了,又开始自学起了vue,关于vue是一个很简便的前端框架,要学习它,当然是要先学会搭建vue的环境, 不会搭建环境的程序员不是一个好的程序 ...

  9. NOIP2017 D2T1 奶酪

    洛谷P3958 超级水的并没有用什么几何知识的几何题…… 直接爆搜一遍最后判断有没有与上/下表面相连的球之间连通即可……O(n2)不动脑子的复杂度 最多只是用一下并查集来判断两个点是否连通…… 具体细 ...

  10. ESP8266-让灯闪烁

    例子一:让板子上的LED_BUILTIN灯进行闪烁 void setup() { pinMode(LED_BUILTIN,OUTPUT); } void loop() { digitalWrite(L ...