3

所以我正在为一个使用 iDangerous Swiper 插件的移动网站创建一个图像选取框，并且在尝试使用它时遇到了问题。在基于站点的设置（在此处找到）之后，我根据他们演示的确切规范构建了我的演示页面。但由于某种原因，该功能没有运行，我无法滑动到下一个 div。作为一个移动网站，我使用的是 Jquery 和 Jquery Mobile。有任何想法吗？ 

<body>

<div class="swiper-container">
  <div class="swiper-wrapper">

      <!--First Slide-->
      <div class="swiper-slide">
       <img src="img/1.png" width="200" height="118">
      </div>

      <!--Second Slide-->
      <div class="swiper-slide">
       <img src="img/2.png" width="200" height="118">
      </div>

      <!--Third Slide-->
      <div class="swiper-slide">
        <img src="img/3.png" width="200" height="118">
      </div>

      <!--Fourth Slide-->
      <div class="swiper-slide">
       <img src="img/4.png" width="200" height="118"> 
      </div>

      <!--Fifth Slide-->
      <div class="swiper-slide">
        <img src="img/5.png" width="200" height="118">
      </div>      

  </div>
</div>

<script>

$(function(){
    var mySwiper = $('.swiper-container').swiper(options);
})

</script>
</body>
4

2 回答 2

2

iDangero.us 在这里！:) 您的 HTML 是正确的。但是您的示例中的“选项”是什么？这应该是一个带有参数的对象，或者如果您想使用默认选项，那么只需从您的示例中删除“选项”字样： var mySwiper=$('.swiper-container').swiper()

于 2013-04-18T22:09:21.323 回答
2

要使用 Swiper 按钮，您需要在 mySwiper 对象上使用 .swipeNext() 和 .swipePrev() 方法，例如：

<!-- Add somewhere in HTML your buttons:-->
<span class="button-next">Next button</span>
<span class="button-prev">Previous button</span>
<script>
$(function(){
  var mySwiper = $('.swiper-container').swiper();
  //"Next" button - some HTML element with "button-next" class
  $('.button-next').click(function(){mySwiper.swipeNext()})
  //"Prev" button - some HTML element with "button-prev" class
  $('.button-prev').click(function(){mySwiper.swipePrev()})

})
</script>
于 2013-04-19T19:10:45.917 回答