为每个滑块DIV生成滑动JS滑块 [英] Generate Swipe JS slider for each slider DIV

查看:55
本文介绍了为每个滑块DIV生成滑动JS滑块的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我首先说我不是程序员,我是设计师。我对jQuery知之甚少,虽然有足够的修补,我经常可以得到我需要的工作。所以请耐心等待。

I'll start off by saying I'm not a programmer, I'm a designer. I have a limited knowledge of jQuery, though with enough tinkering I can often get what I need to work. So bear with me here.

我正在制作一个网站(可能由Wordpress提供支持),在一个页面上会有多个滑块。我已经设法让Swipe JS在一个滑块上运行得很好但是我需要一些代码来搜索我的所有滑块DIV并为它们创建一个新的Swipe对象。

I'm making a site (likely powered by Wordpress) that will have multiple sliders on a single page. I've managed to get Swipe JS to work just fine with one slider but I need some bit of a code that searches for all my slider DIVs and creates a new Swipe object for them.

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

The bit of code I used for one slider was "var slider = new Swipe(document.getElementById('slider'));" but that won't work for multiple sliders.

HTML的结构如下所示:

Structure of the HTML looks like this:

<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>

我很感激你们给予的任何帮助。谢谢!

I'd appreciate any help you guys can give. Thanks!

推荐答案

如果你想要所有swipestry这样的东西

if you want all swipestry something like this

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

你只需要分配所有滑动 class =slider属性。

you just need to assign all swipes the class="slider" attribute.

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

无论ID是如何工作的,因为我们选择具有特定类的元素。

no matter how the ID is it should work because we select the elements with a specific class.

您可以使用

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

您需要多少次滑动的数字,但请记住:刷卡否。 1将是 swipes [0]

the number demands on how many swipes you have, but remember: Swipe no. 1 would be swipes[0]

这篇关于为每个滑块DIV生成滑动JS滑块的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆