离子幻灯片中不支持dynamicBullets？
来自swiper.js和swiper.js的离子幻灯片支持dynamicBullets: boolean。
如何在离子幻灯片中使用dynamicBullets？
我甚至尝试将swiper.js注入到ionic项目中，但效果并不好。我认为ionic中的某个地方存在冲突错误，因为它是从swiper.js采用的
浏览 2提问于2018-01-24得票数 1
1回答
我正在开发一个基于黎明的主题，我已经添加了2个JS文件： <script src="{{ 'swiper.js' | asset_url }}" defer="defer"></script>
<script src="{{ 'swiper-handle.js' | asset_url }}" defer="defer"></script> 问题:只有文件swiper.js是从本地加载的，而文件swiper-handle.js是从Shopify CD
浏览 60提问于2021-09-30得票数 0
我试图使用swiper.js使我的html页面可滑动。我有三个html页面：‘主页’，‘用户配置文件’和‘内容页’。阅读swiper.js文档，示例只显示如何在div中滑动例如照片。因此，我不知道如何滑动html页面。
我的问题是：应该所有三个html页面实际上都是一个html，但每个页面都是在一个div中分离的吗？
浏览 2提问于2017-09-11得票数 0
回答已采纳
1回答
我刚从cdnjs中添加了Swiper 4.0.2。但是，一旦我刷新页面，这个错误就会出现在我的控制台上。
swiper.js:16 Uncaught TypeError: Cannot set property 'Swiper' of undefined
这是swiper.js第16行：
13 (function (global, factory) {
14 typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = f
浏览 3提问于2017-10-24得票数 0
回答已采纳
Swiper.js在大屏幕上工作，但在移动环境下却不能工作。
init道具
<Swiper
effect={"coverflow"}
grabCursor={true}
centeredSlides={true}
slidesPerView={"auto"}
coverflowEffect={{
rotate: 30,
stretch: 0,
depth: 200,
modifier: 1,
slideShadows: true,
}}
>
浏览 6提问于2021-08-24得票数 0
我想使用swiper.js，在中间显示2张完整的幻灯片，然后两边各放一半幻灯片。我想这是可能的，但我想不出怎么做。
有人能告诉我吗？想要重新创建下面的内容。
谢谢!
浏览 32提问于2022-02-21得票数 0
我正在尝试使用swiper.js创建旋转木马。下面是我的配置： {
slidesPerView: 1,
slidesPerColumn: 1,
initialSlide: this.initialSlide,
loop: true
} 正如预期的那样，这将在第一个和最后一个元素附近添加重复的幻灯片。当我从第一个元素滑动到最后一个元素时，它会显示这个重复的空白幻灯片，而不是最后一个。 看起来幻灯片被错误地复制了，因为"src“属性被从<img>标签中删除了，如何解决这个问题？ 你有什么建议吗？ 另外，我正在使用angular的ngx-swip
浏览 21提问于2019-06-28得票数 0
我只是将3d swiper.js添加到我的html页面。我想添加新的帖子到这个滑块的时候，我发布的网站。我该怎么做呢？有没有办法解释。谢谢?
浏览 22提问于2021-05-30得票数 0
我在用swiper.js安装纱加刷
这是我的代码，但它没有显示任何幻灯片什么的。
<swiper
:slides-per-view="3"
:space-between="50"
@swiper="onSwiper"
@slideChange="onSlideChange"
>
<swiper-slide>Slide 1</swiper-slide>
<swiper-slide>Slide 2</swiper-slide>
浏览 7提问于2020-11-08得票数 0
回答已采纳
我有一个很奇怪的问题，我不能把我的手指。
我使用的是，它进行了令人敬畏的页面转换，是一个可爱的旋转木马。问题是，它使您的页面成为SPA，因此您必须重新编写init脚本。告诉你真相真是太痛苦了。
在我的barba.js文件中，我在顶部调用了一个旋转木马
import barba from "@barba/core";
import { homeCarousel } from './swiper.js'
function initCarousel() {
if (document.querySelector('.swiper-container&#
浏览 3提问于2020-09-09得票数 0
回答已采纳
我有像这样的绑定触摸事件：
语言: lang-js：
render() {
return (
<div style={this.props.style} onTouchStart={this.touchStartHandler.bind(this)} ref="layer"
onTouchMove={this.touchMoveHandler.bind(this)}
onTouchEnd={this.touchEndHandler.bind(this)}>
浏览 1提问于2016-01-06得票数 0
我在我的项目中使用Swiper.js。我想知道当前的活动滑块。
如何在swiper.activeIndex条件下使用if？
或者，我想为到达预期滑块时编写一些代码。
浏览 2提问于2019-07-24得票数 1
回答已采纳
在Swiper.js实例中使用sortable.js列表时，操作该列表将不再起作用。
我试着设置
swiper.noSwiping = true;
但是bug保持不变。这里有一个Codepen，可以让你轻松地重现这个问题。
浏览 5提问于2018-07-25得票数 0
我在我的项目中使用swiper.js，有时(可能10次中有1次)，通过单击关联的项目符号导航不起作用-它会转到上一张幻灯片。我的swiper配置对象包含用于分页的clickable: true。
浏览 2提问于2020-07-30得票数 0
我有一个状态“isOpen=false”，当状态变为true时，我需要更新或重新初始化swiper.js。怎么可能做到呢？ @observable
public isOpen=false
private DOMTopSwiper = createRef<HTMLDivElement>()
const topSwiper = new Swiper(this.DOMTopSwiper.current, {
spaceBetween: 0,
navigation: {
nextEl: ".top-swiper-button-next",
p
浏览 12提问于2019-02-01得票数 0
Swiper.js导航按钮消失在生产模式中
Swiper.Js导航按钮显示在开发中，但没有显示在产品中。
next.config.js
const withSass = require('@zeit/next-sass');
const withCSS = require('@zeit/next-css');
module.exports = withCSS(withSass({
webpack(config) {
config.module.rules.push({
test: /\.(png|jpg|gif|svg|eot|ttf|
浏览 3提问于2021-02-28得票数 2
回答已采纳
2回答
我正在使用swiper.js。我希望新幻灯片/活动幻灯片始终滚动到顶部，因此当新幻灯片进入视口时，内容必须滚动到顶部。
这里我有一把小提琴：
我认为这个脚本可能会完成我需要的东西，但它似乎不起作用：
swiper.on('slideChangeEnd', function(s) {
s.slides.each(function() {
if ($(this).index() !== s.activeIndex) $(this)[0].scrollTop = 0
});
});
谢谢!
浏览 2提问于2017-10-09得票数 2
1回答
我有自定义构建的JS库(即swiper.js)。是否可以在下载浏览器之前检查缓存中是否有其CDN版本？通常它是130KB，但我想要的版本(包含更少的函数)只有70KB，所以如果用户还没有缓存它，我不想添加那些额外的KB来从CDN获取它。这个是可能的吗？
浏览 1提问于2019-10-02得票数 0
1回答
我一直在寻找一种让我的Swiper.js旋转木马在Youtube React Player上筑巢时响应的方法。我终于找到了解决办法，希望这能帮到别人。如果slidesPerView大于2甚至浮动数(如slidesPerView={1.3} )，这也是可行的。
浏览 9提问于2022-10-04得票数 0
回答已采纳
让swiper.js正常工作时遇到问题。需要嘟嘟声/低音部。我对js生成器完全陌生，在遇到问题之前，我只能完成大约一半的演练。
当我在终端中输入命令dist时，我得到以下响应：-bash: dist：$grunt not found
我遗漏了哪一步？
遵循着曲折的脚步，直到字母：
浏览 0提问于2014-09-16得票数 0
1回答
我正在使用swiper.js制作图像和视频的幻灯片。在这里，我想更改用户单击按钮时的延迟。但是我不知道如何更改swiper中的延迟或任何其他方法来做它？？ 我已经阅读了swiper.js的文档，但在创建swiper对象后没有更改延迟的功能。 JSFiddle(code) <div id="swiper" class="swiper-container mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide&#
浏览 135提问于2021-07-03得票数 2
回答已采纳
我试图导入在nextjs项目中使用官方文档中提供的cdn链接。这是我的密码
import React from 'react'
import Image from 'next/image'
import Head from 'next/head'
import swiper from '../Configuration/swiper'
const aboutus = () => {
return (
<>
<Head>
<link rel="styleshe
浏览 8提问于2022-07-04得票数 0
1回答
我在做一个网站。我想通过swiper.js添加一个立方体效果。但是当我在我的JS中添加一个效果：'cube‘时，整个网站都疯了:/
但是如果删除效果：'cube'，或者使用flex-box而不是GRID，一切都会正常工作吗？
请帮助
浏览 14提问于2021-02-22得票数 0
我正在使用Ionic Framework v5和ion-slides，它们基于Swiper.js，它有一个virtual property，可以根据您在项目列表中的位置智能地从DOM加载和卸载数据。 不过，我找不到任何关于如何在Ionic中实现这一点的信息。如果有任何建议，我们将非常感谢。谢谢。
浏览 14提问于2020-06-19得票数 1
回答已采纳
我想在svelte上增加滑块，我的问题是：
可以在脚本标记中添加css，如下所示：
<script> import from "styles.css" ... </script>
因为导入到头是很棘手的()
我向svelte添加了swiper.js文件，它几乎可以工作。它适用于触摸(鼠标)，但按钮不工作(.swiper-button-next .swiper-button-prev)。是否存在特殊的导入.js文件规则？
代码示例：
浏览 3提问于2020-08-28得票数 4
回答已采纳
1回答
我是JQuery的新手，我有个小问题。我有一个图库，我使用Swiper.js作为滚动，但我想得到每个图像的宽度和高度取决于，例如，点击或滑动(ipad)为每个图像应用不同的样式。
在这里，代码：
我为我糟糕的英语：_感到抱歉(非常感谢！
浏览 3提问于2014-02-07得票数 0
回答已采纳
如果我有一个自定义菜单的话。
如何在Swiper.js中随时转到特定幻灯片？
<div class="menu">
<ul>
<li class="slide-3">go to slide 3</li>
<li class="slide-5">go to slide 5</li>
<li class="slide-1">go to slide 1</li>
</ul>
</div
浏览 15提问于2014-05-29得票数 14
我希望重写左/右键的默认例程，但无法通过Swiper.js API ()找到如何实现这一点。
看起来，它只提供了禁用/启用默认操作的方法：
mySwiper.keyboard.enabled // Whether the keyboard control is enabled
mySwiper.keyboard.enable() // Enable keyboard control
mySwiper.keyboard.disable() // Disable keyboard control
浏览 6提问于2017-12-01得票数 2
回答已采纳
1回答
我在这里使用swiper.js构建了一个简单的滑块：
正如你所看到的，进度条的“包装器”有圆角的边缘，但突出显示的内部条没有。
我已经解决了我能想到的所有css解决方案，但我什么也没想出来，希望以前有比我更聪明的人来过这里。
谢谢您:)
浏览 1提问于2020-01-24得票数 0
我使用的是swiper.js并一旦使用了swper1.def()；运行、重新构建、滑到某个幻灯片并单击。
我得到了swiper.js:438 Uncaught的错误:无法读取空的属性'params‘
这是密码。我很感激所有的帮助。非常感谢。
$('.call').click(function(e){
e.preventDefault()
$("#menu").addClass("hide");
$("#slider").removeClass("hide");
selector.push("ad
浏览 3提问于2016-01-06得票数 1
1回答
我使用swiper.js via CDN...the的问题是，在swiper bundle.min.css CDN文件中，.swiper-button-next, .swiper-button-prev设置为top:50%;，如下所示：-
.swiper-button-next, .swiper-button-prev {
position: absolute;
top: 50%;
}
我想将.swiper-button-next, .swiper-button-prev设置为bottom:11px;，我尝试在我自己的css文件中这样做，但是CDN的top:50%正在重写它。我
浏览 1提问于2021-12-01得票数 0
回答已采纳
有没有一种方法既可以让幻灯片居中，也可以让无限循环，以及swiper.js的缩略图？我有以下设置，但当我添加loop true时，它似乎不起作用。
var mySwiper = new Swiper('.swiper-container',{
paginationClickable: true,
centeredSlides: true,
initialSlide:1,
speed:1200,
centeredSlides: true,
slidesPerView: 'auto'
谢谢
浏览 28提问于2014-07-02得票数 1
import React, { Fragment } from "react";
import { Swiper, SwiperSlide } from "swiper/react";
import SwiperCore, { EffectCoverflow, Navigation } from "swiper";
import "swiper/swiper-bundle.css";
import "./App.css";
import Party2 from "./Party2.png";
S
浏览 66提问于2020-11-07得票数 3
回答已采纳
我从Swiper.js (参考源复制 )中查看，第一行是
export { default as Swiper, default } from './core/core.js';
其形式如下：
export { default as Virtual } from './modules/virtual/virtual.js';
在MDN文档中，我还可以找到类似于
export { Something as default }
是有可能的。因此，我目前可以看到以下语法：
export { Something as default }
export { default
浏览 13提问于2022-02-08得票数 0
回答已采纳
1回答
我正在将添加到我的swiper.js刷卡中。根据示例，包含幻灯片的数组使用如下所示的字符串(docs表示幻灯片: any，但我尝试了组件和其他东西，但没有其他东西起作用)：
virtual: {
// cache: true,
slides: (function() {
const slides = [];
for (let i = 0; i < 1; i += 1) {
slides.push('<img src="https://picsum.photos/600/600/?image=1/>';
}
浏览 5提问于2022-06-09得票数 0
1回答
对于p标记，我需要屏幕阅读器读取的文本与p标记中包含的文本不同。我需要人类看到“乔丹”和屏幕阅读器来阅读“迈克尔·乔丹”。这些都在swiper.js的响应式网格中。添加标题不起作用。我怎么才能让它工作呢？(我可以使用不同的HTML标记和属性来获得相同的效果。) <p role="title" title="Michael Jordan">Jordan</p>
浏览 14提问于2020-11-24得票数 1
回答已采纳
我现在的处境不一样。我使用Swiper.js作为我的React应用程序。我需要改变幻灯片上的应用主题颜色，它必须是动态的。这就是我需要传递一些道具给SwiperSlide，并使这个道具在幻灯片上的变化。我该怎么处理呢？
<Swiper
id="pathway-slider"
slidesPerView={1}
onSlideChange={(swiper) => {
console.log("Slide index changed to: ", swiper);
}}
浏览 2提问于2021-10-20得票数 2
回答已采纳
1回答
我在Laravel 8项目中使用了Swiper.js CDN，并将其安装在NPM中。由于某些原因，CSS没有导入( javascript运行良好)。
我尝试过几种不同的导入方式，但我不知道为什么它不导入。这就是我目前在我的main.css中拥有的
main.css
@import "~swiper/swiper-bundle.min.css"
任何帮助都将不胜感激！
浏览 5提问于2021-05-17得票数 0
回答已采纳
2回答
Swiper.js有个大问题
是否有可能使幻灯片的宽度再次与内容的宽度相等？
目前，所有幻灯片都延伸到父元素的全部宽度，这很可能是因为我设置了容器网格元素。
我一直试图解决这个问题很长时间，但我只是不能告诉我，我会感激！
(截图附后)
浏览 10提问于2021-08-24得票数 5
0回答
我正在使用Swiper.Js为我的网站上的滑块，并需要使用同一页面上的两个滑块。我的问题是，如何让每个CSS都不同？我不能为另一个滑块重写所有的类，因为我从他们的网站连接了样式表和JS。
CSS有没有某种子类函数？
谢谢
浏览 7提问于2017-11-29得票数 0
回答已采纳
谢谢您的阅读，我尝试使用swiper.js，它可以很好地处理延迟加载演示，但是在演示中，每张幻灯片只有一张图像，但我想表示每一张幻灯片4个img，结果显示每一张幻灯片中只有第一个img。
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
<!-- Required swiper-lazy class and image source s
浏览 8提问于2015-10-15得票数 0
回答已采纳
当lazyloading处于活动状态时，是否有一种方法可以使用swiper.js预加载下一个或两个图像？
该滑块包含100幅图像，我们不希望在页面打开时加载这些图像，但我们希望加载第一张和下一张图像，让它们在动画运行时出现在下一张幻灯片中。
有什么想法吗？
浏览 3提问于2021-08-11得票数 1
我一直在使用swiper.js javascript库创建一个带有垂直缩略图的滑块，如果单击缩略图，主图像将“滑动”到该图像。
当我手动单击缩略图时，功能非常好，但是，当用户选择颜色样本时，我需要更改主图像。我在缩略图元素上调用了javascript函数click()，我尝试对img本身和包含img的div调用click()。不幸的是，我没有看到相同的功能，我的单击事件确实注册了，并且我能够控制日志/更改缩略图的边框，但是它没有运行swiper.js函数"onThumbClick"：
在swiper.js中有一个名为"onThumbClick“的函数，我做了一
浏览 1提问于2018-12-26得票数 2
我需要公开从dom元素调用的类的状态。
我已经创建了一个类，我将将其作为new myCustomClass()进行实例。这个类与DOM元素相关。
我需要在课堂上做些什么来访问他的方法和属性？
我需要这样的东西(这是swiper.js做的事)
var foo = document.querySelector('.element-where-class-is-instanced').myCustomClass;
foo.init()
感谢所有人
浏览 5提问于2022-03-31得票数 0
回答已采纳
我正在使用swiper.js创建一个简单的幻灯片。
我的配置如下所示：
var mySwiper = new Swiper( '#swiper-container',
{
autoplay: {
delay : 400000
},
l
浏览 2提问于2017-12-05得票数 3
我使用Swiper.js在一个我正在为客户构建的网站上使用滑块。他们的要求是这样的:滑块内有10项，一次有4项可见，每次单击箭头时，4项将滑出，4项将滑入其中。所以如果我有幻灯片1-10，滑块应该是这样的：
第一视图: 1-4幻灯片第二视图: 5-8幻灯片第三视图: 9，10，1，2幻灯片第四视图: 3-6幻灯片.诸若此类。
它是一个无限循环，每次总是滑动4次。我试着用swiper.js创建这样一个滑块，结果非常接近，但并不完全是这样。下面是我能够创建的内容：
您会注意到，在前两次点击中，情况很好，按预期进行，但是一旦视图中有幻灯片9、10、1和2，然后单击next，它一次只移动2张幻灯片，在
浏览 7提问于2020-02-13得票数 3
2回答
我试着用Swiper.js和Handelbar来制作滑块。我在下面设置了swiper选项
var swiper = new Swiper('.swiper-container', {
slidesPerView: 3,
direction: 'horizontal'
});
我尝试了一些更改选项，例如
freeMode:真
幻灯片:1 slidesPerColumnFill：“行”
autoHeight:真
但是没有任何东西修复意外的垂直布局。
我想让所有的幻灯片水平地显示在一行中，我也不断地改变滑动容器类和滑动幻灯片的样式
浏览 2提问于2019-08-20得票数 4
我有js函数的滑块(swiper.js)，它检查这是否是最后一张幻灯片，并在向另一个div添加一些内联css之后。但是，在我回到上一张幻灯片之后，这个内联css就会停留在div上。我需要这样做-如果这是最后一张幻灯片=做这个css，如果不是=什么都不做。我怎么能达到这个目标？我还需要补充什么？谢谢!
galleryTop.on('reachEnd', function () {
var nFilter = document.getElementById('left-side-meta');
nFilter.setAttribute("
浏览 3提问于2020-09-11得票数 2
回答已采纳
当从swiper.js点击时，我无法让定制的子弹滑动。
这是我的
我添加了config属性
“可点击:真”
这是我的刷卡代码
private pagination: SwiperPaginationInterface = {
el: '.swiper-pagination',
type: 'bullets',
clickable: true,
renderBullet: function(index, className) {
return '<span class="' + className
浏览 14提问于2020-07-28得票数 5
回答已采纳
当我使用Swiper.js提交我的Cordova应用程序时，我得到了以下错误。 TMS-90809:过时的应用程序接口用法-从2020年12月起，将不再接受使用UIWebView的应用程序更新。相反，为了提高安全性和可靠性，请使用WKWebView。了解更多信息(https://developer.apple.com/documentation/uikit/uiwebview)。更正问题后，您可以将新的二进制文件上载到App Store Connect。 无论如何，更新Swiper以支持WKWebView？有什么建议吗？
浏览 55提问于2020-05-03得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
