- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在为 swiper 使用这种配置:
var swiper = new Swiper('.swiper-container', {
spaceBetween: 30,
slidesPerView: 3,
speed: 2500,
centeredSlides: true,
autoplay: 1000,
autoplayDisableOnInteraction: false,
loop: true
});
到目前为止,这工作正常。但是刷卡器是否有可能在每 3 张幻灯片之间不停止?现在总是有一个休息时间,直到接下来的 3 张幻灯片滑入。我正在寻找一个无限连续循环 slider 选项。这可能吗?
最佳答案
是的,这是可能的,加油 mariorendic
var swiperOptions = {
loop: true,
freeMode: true,
spaceBetween: 0,
grabCursor: true,
slidesPerView: 7,
loop: true,
autoplay: {
delay: 1,
disableOnInteraction: true
},
freeMode: true,
speed: 5000,
freeModeMomentum: false
};
var swiper = new Swiper(".swiper-container", swiperOptions);
body {
margin: 0;
padding: 0;
background: #eee;
font-family: sans-serif;
font-size: 14px;
background: #404449;
}
.swiper-container {
height: calc(100vh - 120px);
margin: 60px;
}
.swiper-slide {
width: 28vw;
overflow: hidden;
background-position: top;
background-size: cover;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-size: 20px;
font-weight: bold;
}
.swiper-wrapper {
-webkit-transition-timing-function:linear!important;
-o-transition-timing-function:linear!important;
transition-timing-function:linear!important;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.7/js/swiper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.7/css/swiper.min.css" rel="stylesheet"/>
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide" style="background-image: url(https://placekeanu.com/250/g);">1</div>
<div class="swiper-slide" style="background-image: url(https://placekeanu.com/260);">2</div>
<div class="swiper-slide" style="background-image: url(https://placekeanu.com/270);">3</div>
<div class="swiper-slide" style="background-image: url(https://placekeanu.com/270/y);">4</div>
<div class="swiper-slide" style="background-image: url(https://placekeanu.com/280/y);">5</div>
<div class="swiper-slide" style="background-image: url(https://placekeanu.com/190/y);">6</div>
<div class="swiper-slide" style="background-image: url(https://placekeanu.com/300/);">7</div>
</div>
</div>
关于swiper.js - Swiper 连续循环,滑动之间没有停顿,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43801782/
我使用此函数的目标是返回一个整数,该整数代表用户完成的所有习惯。我的数据库结构是习惯的集合,每个习惯都有一个包含其历史的子集合。下面的函数利用习惯列表,并使用习惯ID来获取该习惯的历史记录。我的问题是
我试图捕捉 AVPlayer 无法继续播放的时刻,以防没有更多媒体可用(网络太慢、信号丢失等)。如文档和不同示例中所述,我正在使用 KVO 来检测: item = [[AVPlayerItem all
我正在使用 npm 包 busboy 来解析多部分表单请求和写入流以将发送的文件写入磁盘。 这适用于小文件,但是当我尝试使用更大的文件 (7MB) 时,似乎只有大约 5MB 被写入磁盘,然后似乎事情停
提供一个最小的代码示例将很困难,但我将提供一些 sudo 代码以希望能够理解要点/问题。 TL;DR:我的工作队列启动,被中断,然后永远不会完成导致 CPU 停顿。 我正在为 PCIe 设备创建网
We are facing an issue on which we need some help. 简要说明: We have enabled SMP in Linux 2.
因此,我已准备好将更新上传到我的其中一个应用程序。一切都正确签名并且验证通过。然而,当尝试将 bundle 上传到 iTunes Store 时,它只是停在(在 XCode Organizer 中
我有一个在 Atmel AT91SAM9260EK 板上运行的嵌入式 Linux 系统,在该板上我有两个以实时优先级运行的进程。管理器进程使用 POSIX 消息队列定期“ping”工作进程以检查工作进
当我尝试运行命令mvn archetype:generate时,它在尝试下载maven-assemble-plugin-2.2-beta-5.jar时停止 无论我取消批处理多少次或关闭cmd并重新启动
我有一个页面正在循环播放 HTML5 视频。当您向下滚动页面时,jQuery 会向 nav 元素添加一个类。然后 CSS 将过渡应用到 th 的 left 属性。在 Firefox 中,它运行良好,但
我是一名优秀的程序员,十分优秀!