swiper相关内容

图像在轮播模式下消失(jQuery Swiper 插件)

我正在使用 iDangero.us Swiper 插件作为主页滑块,我在所有浏览器中都遇到了一个特殊的问题.我有 4 张幻灯片(每张都是一个带有背景图像和一些文本和图像的 div),在我滑动(或单击“下一步"按钮)从最后一张幻灯片转到第一张之前,一切看起来都很好.新幻灯片完全显示为白色,只需轻轻拖动即可使其正常显示. 有趣的是,如果我向后滚动(将滑块向左拖动或单击“后退"按钮),则不会发生这 ..
发布时间:2022-01-24 18:01:35 其他开发

滑动滑块空白

我对 Swiper 滑块有一些问题.当我滚动到滑块的末尾时,可以看到一些空白区域. http://take.ms/siqXj swiper = new Swiper(profile_images, {slidesPerView:4,nextButton: '.swiper-button-next',prevButton: '.swiper-button-prev',观察者:真}); ht ..
发布时间:2022-01-24 17:43:40 其他开发

设置 HTML 中的属性时,滑动滑块将类添加到活动幻灯片

当活动幻灯片设置了属性(例如“navbar-dark")时,我想向导航栏添加类.我尝试过上课,但我的功能并不完美.当我更改幻灯片时,班级将添加到第二张幻灯片而不是第一张幻灯片. $(document).ready(function () {var mySwiper = new Swiper('.swiper-container', {方向:'水平',循环:假,鼠标滚轮: {反转:假,},});m ..
发布时间:2022-01-24 17:40:47 前端开发

如何使用带有 jquery 选项卡的 swiper 滑块?

我正在尝试将 idangero swiper 与 jquery 选项卡一起使用,我得到了我想要的所有结果,除了 pagination.slider 分页只显示一个项目符号.与单个选项卡一起使用时它工作正常,但我不知道如何应用 swiper需要两个或更多选项卡.这是我的代码和 jsfiddle 链接,例如.http://jsfiddle.net/Rzeiwald/wunw9enL/3/ -http: ..
发布时间:2022-01-24 17:38:16 其他开发

swiper 自定义分页只滑动一次

我用 swiper 制作了一个非常简单的图像滑块,然后使用 swiper 的 "paginationCustomRender" jQuery 添加了自定义分页和数据属性它生成的分页很好,滑动时一切正常,但它不可点击,所以我添加了一个小函数来告诉我的滑块在点击分页中的一个标签时“slideTo()"目标幻灯片但它只工作一次然后该功能将不会再次启动.我已经搜索过,从我发现大多数人没有使用 swiper ..
发布时间:2022-01-24 17:14:48 其他开发

Swiper 幻灯片 - 显示上一张/下一张幻灯片的结束/开始,如 Airbnb Slider?

上面是 Airbnb 的滑块.有没有办法用 Swiper 获得类似的效果? 对于第一张幻灯片,左边有一个空格,开始下一张幻灯片. 对于中间的幻灯片,有上一张的开始和结束,下一张幻灯片. 对于最后一张幻灯片,右侧有一个空白区域,左侧有上一张幻灯片的末尾. 解决方案 只需设置 slidesPerView 选项使用小数位,eg: var swiper = new Swiper('.s ..
发布时间:2022-01-13 20:25:14 其他开发

jQuery Swiper 脚本在加载 Ng-Repeat 元素后运行

我正在使用 AngularJS、jQuery、HTML、CSS 和 Bootstrap 制作一个 Web 应用程序,我想从位于 Apache2 服务器中的 JSON 中选择一些图像链接并使用它们来呈现这些图像我的主页.我也想像在旋转木马中一样滑动它们.为了使这项工作发挥作用,我正在尝试使用 iDangero.us Swiper. 当我选择带有 3 个分隔的 div 的图像时,我没有问题.我得 ..

jQuery Swiper 脚本在加载 Ng-Repeat 元素后运行

我正在使用 AngularJS、jQuery、HTML、CSS 和 Bootstrap 制作一个 Web 应用程序,我想从位于 Apache2 服务器中的 JSON 中选择一些图像链接并使用它们来呈现这些图像我的主页.我也想像在旋转木马中一样滑动它们.为了使这项工作发挥作用,我正在尝试使用 iDangero.us Swiper. 当我选择带有 3 个分隔的 div 的图像时,我没有问题.我得 ..

在有很多 swipers 的页面上的移动 chrome 中跳转粘性页脚

我有一个包含大量图像内容的项目,在移动设计中有很多带有照片和滑动功能的块 https://swiperjs.com.在移动设备的chrome浏览器中,当有很多带有swiper的元素时,固定位置的footer在地址栏隐藏或显示的瞬间开始上下跳跃. 带有移动设备错误的 Gif:https://giphy.com/embed/PJ4sLlwts4ziBbCqcX ..在平板电脑上:https://g ..
发布时间:2021-09-03 18:31:02 前端开发

Swiper 自动播放在 Angular 中不起作用(单张幻灯片)

我正在使用带有 angular (v 12) 的 swiperjs,我想为每张幻灯片设置特定的延迟.我从'swiper/core' 导入了{Autoplay} 并调用了方法SwiperCore.use([Autoplay]).如果我为所有幻灯片设置延迟,它就可以正常工作: .ts 组件自动播放:自动播放选项 |布尔值 = {延迟:3000,disableOnInteraction: 假}.htm ..
发布时间:2021-09-03 18:30:59 其他开发

Angular swiper 幻灯片不会卡住

我正在尝试将 Swiper Angular 库 实施到我的 Angular 10/Ionic 5 项目中.我遇到的问题是幻灯片没有对齐,而且似乎只有一个我可以拖动的大页面. 这是我尝试过的入门示例,我相信它显示的页面是正确的,但是滑动部分似乎有点偏离,没有捕捉,如果放开它也不会继续滑动,如图所示 我还在构造函数中安装了导航部分所需的所有组件: constructor() {Swipe ..
发布时间:2021-09-03 18:30:53 其他开发

Raect中的Swiper js如何在MouseEnter上停止自动播放并在MouseLeave上启动它

我正在尝试通过构建一个具有自动播放功能的简单图像滑块来学习 swiper.js 的反应,但我不知道如何停止自动播放 onMouseEnter 并启动它 onMouseLeave.我试过 onMouseLeave={Swiper.autoplay.stop} 没有用. 从'react'导入React;从'./HeroSlider.module.css'导入类;从 'swiper/react' 导入 ..
发布时间:2021-09-03 18:30:50 其他开发

设置 HTML 中的属性时,Swiper 滑块将类添加到活动幻灯片

当活动幻灯片设置了属性(例如“navbar-dark")时,我想向导航栏添加类.我试过上课,但我的功能并不完美.当我更换幻灯片时,班级正在添加到第二张幻灯片而不是第一张幻灯片. $(document).ready(function () {var mySwiper = new Swiper('.swiper-container', {方向:'水平',循环:假,鼠标滚轮: {反转:假,},});m ..
发布时间:2021-09-03 18:30:47 前端开发

为什么 Swiper 在 angular 中对我不起作用?

我正在尝试使用 Swiper 但我无法实现它,我按照文档中的步骤操作 (https://swiperjs.com/get-started/),问题在于所有图像/幻灯片混合在一起,它允许我滑动到一边,但由于所有图像都在一起,它不起作用.它向我展示了一张包含所有内容的幻灯片,我可以滑动,但两侧什么也没有.我在 ngOnlnit 中执行此操作,起初甚至刷卡都无法正常工作,但是当我添加 setTimeou ..
发布时间:2021-09-03 18:30:44 前端开发

iDangerous Swiper 插件重置幻灯片

我正在使用 iDangerous Swiper 插件.我需要定期更改 ajax 方法中的所有幻灯片.这样做的最佳方法是什么. 解决方案 在 Swiper 上调用 destroy() 用新幻灯片删除/替换所有幻灯片 清除 .swiper-wrapper 上的 style 属性 再次初始化 swiper ..
发布时间:2021-09-03 18:30:41 其他开发

Swiper 滑块空白空间

我在使用 Swiper 滑块时遇到了一些问题.当我滚动到滑块的末尾时,可以看到一些空白区域. http://take.ms/siqXj swiper = new Swiper(profile_images, {每视图幻灯片:4,nextButton: '.swiper-button-next',prevButton: '.swiper-button-prev',观察者:真的}); htt ..
发布时间:2021-09-03 18:30:35 其他开发

如何在单个 Swiper Slider 上添加多个分页

我想为我的 swiper 滑块添加两个分页,类似于附加图像,一个将保存文本,另一个将是 swiper 滑块中默认出现的点.我尝试了一些代码,但没有用. 这是我的代码 var menu = ['Slide 1', 'Slide 2', 'Slide 3']var swiper = new Swiper('.swiper-container', {分页:{el: '.swiper-分页' ..
发布时间:2021-09-03 18:30:33 其他开发