替换cycle2.js中的<img/>标记

时间:2015-05-06 02:43:50

标签: jquery html image replace cycle2

我想使用cycle2.js滑块。我想循环的每个元素都是一个包含多个文章标签的div元素。

我可以用div替换img标签吗?怎么样?

<div class="cycle-slideshow" 
    data-cycle-fx=scrollHorz
    data-cycle-timeout=0
    >
    <!-- prev/next links -->
    <div class="cycle-prev"></div>
    <div class="cycle-next"></div>
    <img src="http://malsup.github.io/images/p1.jpg"> <!-- Can I convert img tags to div elements? -->
    <img src="http://malsup.github.io/images/p2.jpg">
    <img src="http://malsup.github.io/images/p3.jpg">
    <img src="http://malsup.github.io/images/p4.jpg">
</div>

我现在试图让JS显示三篇文章,并在经过一段时间后更改显示的三篇文章。考虑此代码的页面在奇数(损坏)位置一次显示一篇文章。有什么我做错了吗?

<div class="cycle-slifdshow" data-cycle-slider="div">
  <div class="three-at-a-time">
    <article> ...</article>
    <article>...</article>
    <article>...</article>
  </div>
  <div class='three-at-a-time>
    ...
  </div>
  ...
</div>

1 个答案:

答案 0 :(得分:0)

文档说是http://jquery.malsup.com/cycle2/faq/#non-image

  

我想使用不是图片的幻灯片。我怎么告诉Cycle2我的   幻灯片是?

     

使用data-cycle-slides属性提供jQuery   选择器,用于标识容器中的元素   幻灯片。例如,如果您的幻灯片是带有li幻灯片的幻灯片   会设置如下属性:data-cycle-slides =“li”

<ul class="cycle-slideshow" data-cycle-slides="li">
     <li><img src="path/to/some/image1.jpg"></li>
     <li><img src="path/to/some/image2.jpg"></li>
     <li><img src="path/to/some/image3.jpg"></li>
</ul>