Question

我有一个使用jQuery Cycle2插件的Youtube视频滑块。我的上一个/下一个箭头定位为覆盖视频。我正在使用jQuery Cycle2滑动插件在触摸屏设备上启用滑动事件。

jsfiddle示例：http://jsfiddle.net/tritterskamp/22cBg/17/

我在iOS设备上遇到两个问题。

滑动手势似乎不起作用。
视频开始播放后，箭头不再有效。

类似于箭头问题：Overlay image over a you-tube video is not clickable on I-pod/ I-phone devices

周期滑动功能是否与Youtube视频完全不兼容？

任何见解都会有所帮助！

感谢。

HTML：

    <div class="feat-videos">
    <div class="slide">
        <iframe src="http://www.youtube.com/embed/zlPb8vsvcoM" frameborder="0" allowfullscreen=""></iframe>
    </div>

    <div class="slide">
        <iframe src="http://www.youtube.com/embed/o6QubbA4E7A" frameborder="0" allowfullscreen=""></iframe>
    </div>

    <div class="slide">
        <iframe src="http://www.youtube.com/embed/aP0V9mQTc3g" frameborder="0" allowfullscreen=""></iframe>
    </div>

    <div class="slide">
        <iframe src="http://www.youtube.com/embed/g6BmU49XG7w" frameborder="0" allowfullscreen=""></iframe>
    </div>

    <div class="cycle-prev">
        &lt;
    </div>

    <div class="cycle-next">
        &gt;
    </div>

    <div class="pager-wrapper">
        <div class="cycle-pager"></div>
    </div>
</div>

JS：

$(document).ready(function () {
// initialize cycle
$('.feat-videos').cycle({
        fx: 'scrollHorz',
        timeout: 0,
        autoHeight: 'container',
        pager: '> .pager-wrapper .cycle-pager',
        slides: '> .slide',
        swipe: true
    });
});

带有Youtube视频的jQuery Cycle2 - 滑动或覆盖导航无法在iOS中运行

0 个答案: