查看: 27308|回复: 9
打印 上一主题 下一主题

终于明白如何做swiper的无缝滚动(走马灯)效果啦

[复制链接]

该用户从未签到

1

主题

1

帖子

23

积分

新手上路

Rank: 1

积分
23
跳转到指定楼层
楼主
发表于 2016-8-25 12:29:20 | 显示全部楼层 回帖奖励 |倒序浏览 |阅读模式
之前研究过
先用论坛中某位大神的效果
var mySwiper1 = new Swiper('.swiper-container1',{
                        autoplay : 1,     
                        speed:3000,
                        loop : true,
                        freeMode:true,
                        slidesPerView : 5,
                        slidesPerGroup : 1,
                        prevButton:'.swiper-button-prev',
                        nextButton:'.swiper-button-next',
                });

使得swiper间隔一个元素滚动一下,autoplay : 1,    间隔一毫秒滚动一下。
然后修改swiper.css的代码
.swiper-container-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: linear;    /*之前是ease-out*/
  -moz-transition-timing-function: linear;
  -ms-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
  margin: 0 auto;
}

将参数改为linear就好啦!
分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 分享淘帖
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|Swiper中文网 ( 粤ICP备15001020号

GMT+8, 2024-5-8 04:19 , Processed in 0.065429 second(s), 26 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表