Question

我已经把头撞了几个小时，我真的很感激这方面的帮助。我知道它很容易解决，但到目前为止还不顺利。

我使用滑动Js作为滑块，我想使用一些子弹作为导航（没有下一个和上一个）。我尝试使用内置滑动功能的getPos（），但我一直在使用“没有方法”＃39;我的控制台出错了。

这是我的HTML：

<section id='slider' class='swipe full-width'>
      <div class='swipe-wrap'>

        <div class="slide">
          <!-- content -->
        </div>

        <div class="slide">
          <!-- content -->
        </div>
 </div>
</section>

 <div class="counter">
      <ul id='position'>
          <li class="on"></li>
          <li></li>
          <li></li>
       </ul>
 </div>

这是我的JS：我把它拉回到了正在工作的地方。我只想点击一个点然后转到相应的幻灯片。

   var slider = Swipe(document.getElementById('slider'), {
      auto: 6000,
      continuous: true,
      callback: function(pos) {

        var i = bullets.length;
        while (i--) {
          bullets[i].className = ' ';
        }
          bullets[pos].className = 'on';
      }

    });

  var bullets = document.getElementById('position').getElementsByTagName('li');

非常感谢任何帮助

链接到我的代码http://codepen.io/veryrobert/pen/sHjwo

链接到插件https://github.com/bradbirdsall/Swipe

Answer 1

这应该有效：

$('li').on('click', function(event){
  event.preventDefault();
  var index = $("li").index(event.currentTarget);
  slider.slide(index);
});

基本上，您需要锻炼相应li的索引并将其传递给滑动.slide方法。然后，这将滑动到请求的幻灯片。

希望有所帮助。

使用子弹作为Swipe JS的导航

1 个答案: