3

我首先要说我不是程序员，我是设计师。我对 jQuery 的了解有限，尽管经过足够的修补，我经常可以得到我需要工作的东西。所以请容忍我在这里。

我正在制作一个网站（可能由 Wordpress 提供支持），该网站将在单个页面上有多个滑块。我已经设法让 Swipe JS 在一个滑块上正常工作，但我需要一些代码来搜索我所有的滑块 DIV 并为它们创建一个新的 Swipe 对象。

我用于一个滑块的代码是“var slider = new Swipe(document.getElementById('slider'));” 但这不适用于多个滑块。

HTML 的结构如下所示：

<div class="slider">
    <ul>
        <li style="display:block;"><img src="01.jpg"></li>
        <li style="display:none;"><img src="02.jpg"></li>
        <li style="display:none;"><img src="03.jpg"></li>
    </ul>

    <a class="prev" href="#" onclick='slider.prev();return false;'>prev</a> 
    <a class="next" href="#" onclick='slider.next();return false;'>next</a>
</div>

我会很感激你们能提供的任何帮助。谢谢！

4

2 回答 2

4

如果你想要所有这样的滑动

var swipes = []
$('.slider').each(function(i, obj) {
        swipes[i] = new Swipe(obj);
    });

您只需要为所有滑动分配class="slider"属性。

<div class="slider" id="slider_1">...</div>
<div class="slider" id="slider_xy">...</div>
<div class="slider" id="foobar">...</div>

无论 ID 如何，它都应该起作用，因为我们选择了具有特定类的元素。

您可以使用访问每次滑动

swipes[1].prev();
swipes[9].prev();

数字要求您有多少次滑动，但请记住：滑动否。1将是swipes[0]

于 2013-01-13T16:50:55.990 回答
0

@tylorreimer

我将 swipe.js 用于 ajax 添加的动态内容。我所做的只是为每个添加的滑块添加一个计数器。所以对于每个 next 和 prevbuttons 我做了一个onclick="swipes[swipeSliderCounter].next()

顺便说一句，我以 mercen 的方式初始化滑块。

$('.slider').each(function(i, obj) {
        swipes[i] = new Swipe(obj);
    });
于 2013-04-16T12:33:22.260 回答