Tag: swiper

图像在轮播模式下消失（jQuery Swiper插件）: 我正在使用iDangero.us Swiper插件作为主页滑块，我在所有浏览器中都遇到了一个特殊的问题。我有4张幻灯片（每张幻灯片都带有背景图片，里面有一些文字和图片），所有看起来都很好，直到我滑动（或点击“下一步”按钮）从最后一张幻灯片转到第一张幻灯片。新幻灯片显示为全白色，只需轻轻拖动即可使其显示正常。有趣的是，如果我向后滚动（向左拖动滑块或单击“后退”按钮），则不会发生这种情况。演示在这里： https ： //dl.dropboxusercontent.com/u/13308449/design-boost/index.html 什么可能导致这种行为，我该如何解决？

iDangero.us Swiper多个实例: 我正在尝试在我的网站上添加多个swipers（ http://www.idangero.us/swiper/ ）。我想添加动态的swipers，所以我为每个swiper使用相同的类。每个swiper看起来像这样： Slide 1 Slide 2 Slide 3 Slide 4 如果我想初始化一个swiper一切正常使用此代码： var swiper = new Swiper(‘.swiper-container’, { pagination: ‘.swiper-pagination’, paginationClickable: ‘.swiper-pagination’, nextButton: ‘.swiper-button-next’, prevButton: ‘.swiper-button-prev’, loop: true }); 我想要的是在一个页面上实例化多个swipers，如下所示： var swipes = []; $(‘.swiper-container’).each(function(i, obj){ swipes[i] = new Swiper(obj, { pagination: ‘.swiper-pagination’, paginationClickable: ‘.swiper-pagination’, nextButton: ‘.swiper-button-next’, prevButton: ‘.swiper-button-prev’, loop: true }); }); […]

如何使用swiper滑块与jquery选项卡？: 我试图使用idangero swiper与jquery选项卡我得到我想要的所有结果，除了pagination.slider分页只显示一个项目符号。使用单选项卡时工作正常，但我不知道如何应用swiper时两个或更多选项卡是必需的。例如，我的代码和jsfiddle链接。 http://jsfiddle.net/Rzeiwald/wunw9enL/3/ – http://jsfiddle.net/Rzeiwald/m61qfck1/感谢您的时间HTML op oop 使用Javascript var swiper = new Swiper(‘.swiper-container’, { pagination: ‘.swiper-pagination’, nextButton: ‘.swiper-button-next’, prevButton: ‘.swiper-button-prev’, slidesPerView: 3, centeredSlides: false, paginationClickable: true, autoplay: 2500, spaceBetween: 15, });

自定义分页swiper.js: 我正在使用swiper.js（ http://idangero.us/swiper/api/#.WCBYcxKLTfA ）请查找我当前代码的工作代码的小提琴： https ： //jsfiddle.net/0L2h1p25/12/ 我现在正试图按照我想要的方式设置它，但我需要解决2个问题。第1部分：分页点不可点击第2部分：导航不起作用第1部分：我已经改变了swiper.js中的分页以获得我想要的样式，它现在阻止用户点击点到达幻灯片。你应该使用： paginationClickable: true, 允许点击但在使用时不起作用; paginationType: “custom”, 我需要帮助使下面的代码可以点击，所以当有人点击它时，它会转到幻灯片。这是swiper执行： // Swiper Execution var swiper = new Swiper(‘.hero-container’, { direction: ‘horizontal’, pagination: ‘.cd-slider’, nextButton: ‘.swiper-next’, prevButton: ‘.swiper-prev’, slidesPerView: 1, paginationClickable: true, spaceBetween: 0, loop: true, speed: 400, effect: ‘slide’, keyboardControl: true, hashnav: true, useCSS3Transforms: false, paginationType: “custom”, […]

Swiper无法在Jquery Mobile中工作: 我正在使用带有Jquery Mobile 的idangero.us的Swiper … 在这里我使用Scroll Container Swiper作为内容滑块…… 只是面对将代码嵌入到一起的很多问题…… http://jsfiddle.net/keuKu/4/embedded/result/ 滚动条没有显示为演示中的滚动条，滚动条也没有粘贴到我留下的标记处… $(function(){ /* Scroll container: */ var sScroll = $(‘.swiper-scroll-container’).swiper({ scrollContainer : true, scrollbar : { container : ‘.swiper-scrollbar’ } }) })

加载Ng-Repeat元素后运行的jQuery Swiper脚本: 我正在使用AngularJS，jQuery，HTML，CSS和Bootstrap创建一个Web应用程序，我想从我的JSON中选择一些位于Apache2服务器中的图像链接并使用它们来在我的主页面中呈现这些图像。我也想像旋转木马一样刷它们。为了做到这一点，我正在尝试使用iDangero.us Swiper 。当我用3个分开的div选择我的图像时，我没有问题。我得到了我的图像然后我可以按照我想要的方式刷它们。我这样做如下所示： main.html中：我使用Swiper从一个图像滑动到另一个图像，它似乎应该工作。这是一个jQuery插件，你可以在这个链接上看到一些演示。 Swipers.js： angular.module(‘swipers’, []) .controller(”,[ $(document).ready(function (){ var swiper = new Swiper(‘.swiper-container’,{ direction: ‘horizontal’, pagination: ‘.swiper-pagination’, paginationClickable: true }) })]); JSON： “background1″:”background-image: url(images/img1.jpg)”, “background2″:”background-image: url(images/img2.jpg)”, “background3″:”background-image: url(images/img3.jpg)” mainController.js： myApp.controller(‘MainController’, [“$scope”,”$http”, function($scope,$http){ $scope.initGetRequestMain = function(){ $http.get(‘http://localhost/main.json’).success(function(data){ $scope.data=data; }) } }]); 问题是，当我尝试使用ng-repeat而不是3个单独的div时，我再也看不到它们了，我的Swiper脚本在完全加载之前就会触发。我的控制台或JSON中没有错误（使用JSONLintvalidation）。下面，我在两种情况下都添加了2个输出屏幕截图。使用3个独立的div：不使用ng-repeat：这是我尝试使ng-repeat工作保持与以前相同的控制器和相同的Swiper脚本的代码： […]