Question

我正在尝试使用其下方的指示符来实现Swipe.js，以便用户知道幻灯片中有更多图像，并且他们也会知道他们到达幻灯片中的位置。我试图这样做它不起作用任何人都可以指出为什么这不起作用？我的代码在

之下

的jQuery

window.mySwipe = $('#mySwipe').Swipe().data('Swipe'),{
                callback: function(pos) {

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

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

HTML

<div id='mySwipe' style='max-width:300px;margin:0 auto' class='swipe'>
    <div class='swipe-wrap'id="featured">
    </div>
</div>

            <nav>
                <ul id="position">
                    <li class="on"></li>
                    <li class=" "></li>
                    <li class=" "></li>
                    <li class=" "></li>
                </ul>
            </nav>

请注意，我通过ajax收到图片，使用的文件链接为https://github.com/bradbirdsall/Swipe

Answer 1

至少我在这里看到语法错误，这不是JS解析器的错误，但看起来像你想要实现的不同。

window.mySwipe = $('#mySwipe').Swipe().data('Swipe'),{
                callback: function(pos) {

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

            }}

也许想成为：

window.mySwipe = $('#mySwipe').Swipe({
  data : 'Swipe',
  callback: function(pos) {
    var i = bullets.length;
    while (i--) {
      bullets[i].className = ' ';
    }
    bullets[pos].className = 'on';
  }
});

或类似的东西。有很多JQuery.Swipe插件，请提供给你的链接。

顺便说一下，使用getElementById来手动迭代元素集合，在附加JQuery时做所有这些混乱是非常奇怪的想法。你的代码可能少两倍。

滑动，js滑动指示器

1 个答案: