Foundation 5- Orbit - HTML5视频无法启动

Question

我试图在轨道滑块中添加一个简短的循环视频，但视频并没有真正开始。我发现如果我去掉“数据轨道”，视频就会像预期的那样初始化和循环，但我意识到数据轨道对于滑块的初始化是必要的。我该怎么做才能让视频真正播放？

<ul class="example-orbit-content" data-orbit data-options="timer_speed: 5000; pause_on_hover: true; resume_on_mouseout: true; navigation_arrows: true; slide_number: false;  variable_height: false; next_on_click: true; swipe: false;">
                <li>
                    <video autoplay loop poster="resources/cover.jpg" id="bgvid">
                        <source src="resources/corn.webm" type="video/webm">
                        <source src="resources/corn.mp4" type="video/mp4">
                    </video>
                </li>

                <li data-orbit-slide="headline-1">
                  <img src="img/dallas.jpg" />
                </li>

                <li data-orbit-slide="headline-2">
                   <img src="img/casey.jpg" />
                </li>

                <li data-orbit-slide="headline-3">
                   <img src="img/jared.jpg" />
                </li>
           </ul>

Answer 1

它看起来与滑块作为一个整体播放滑块的过程有关。我设法解决了这个问题

<script>$('#bgvid').get(0).play();</script>

之后

<script>$(document).foundation();</script>

在框架中。