循环2幻灯片放映youtube

Question

我有一个关于youtube cycle2插件的问题。

以下是代码的设置方式：

    data-cycle2-slides            ='>a'
    data-cycle2-easing            ='".$easing."' 
    data-cycle2-fx                ='".$effect."' 
    data-cycle2-timeout           ='".$timeout."' 
    data-cycle2-pause-on-hover    ='".$pause."' 
    data-cycle2-speed             ='".$speed."'
    data-cycle2-youtube            ='true'
    data-cycle2-youtube-autostart  ='true'
    data-cycle2-youtube-autostop   ='true'

这就是我对视频的称呼：

    <div class="slideshow cycle2-slideshow">
      <a href="http://www.youtube.com/v/boi9_JIEe-Y?hl=en_US&amp;version=3&amp;rel=0" >1</a>
      <a href="http://www.youtube.com/v/srKLoOBqt0w?version=3&amp;hl=en_US&amp;rel=0" >2</a>
      <a href="http://www.youtube.com/v/NLdXk21ZaYw?hl=en_US&amp;version=3&amp;rel=0" >3</a>
      <a href="http://www.youtube.com/v/KPOvBPRYkts?hl=en_US&amp;version=3&amp;rel=0" >4</a>    
     </div>

我基于http://jquery.malsup.com/cycle2/demo/video.php.我遇到的问题是视频没有显示。为什么？

谢谢你。

Answer 1

几件事；

cycle2-slideshow应为cycle-slideshow（移除"2"）

例如。<div class="slideshow cycle-slideshow">

数据属性应以data-cycle-XXXX而不是data-cycle2-XXXX开头（删除"2"）

例如。data-cycle-slides = '>a'

演示

Answer 2

也许在元素中声明数据属性会有所帮助。这是他们应该被宣布的方式。

<div 
     class="slideshow cycle-slideshow"
     data-cycle-slides            ='>a'
     data-cycle-easing            ='".$easing."' 
     data-cycle-fx                ='".$effect."' 
     data-cycle-timeout           ='".$timeout."' 
     data-cycle-pause-on-hover    ='".$pause."' 
     data-cycle-speed             ='".$speed."'
     data-cycle-youtube            ='true'
     data-cycle-youtube-autostart  ='true'
     data-cycle-youtube-autostop   ='true'
 >
           <a href="http://www.youtube.com/v/boi9_JIEe-Y?hl=en_US&amp;version=3&amp;rel=0" >1</a>
           <a href="http://www.youtube.com/v/srKLoOBqt0w?version=3&amp;hl=en_US&amp;rel=0" >2</a>
           <a href="http://www.youtube.com/v/NLdXk21ZaYw?hl=en_US&amp;version=3&amp;rel=0" >3</a>
           <a href="http://www.youtube.com/v/KPOvBPRYkts?hl=en_US&amp;version=3&amp;rel=0" >4</a>    
          </div>

我还要确保PHP的渲染正确，这样它就不会弄乱HTML和数据属性。

EDIT：正如另一个答案所提到的，数据属性和类应该是cycle，而不是cycle2