Question

我使用以下代码在显示框中显示YouTube视频

<a href='#' data-reveal-id='myModal1'><img alt="Some text" src="images/logo.png" class="large-6 medium-6 small-6 columns" /></a>
<div id="myModal1" class="reveal-modal small" data-reveal>
    <div class='flex-video'>
        <iframe src="http://www.youtube.com/embed/dQw4w9WgXcQ?rel=0" class='no-border' allowfullscreen></iframe>
    </div>
    <a class="close-reveal-modal">&#215;</a>
</div>

但这仅适用一次...... 当我打开盒子时，它会完美地显示视频，但是当我关闭它并重新打开它时，我只会得到一个白色区域。
柔性视频似乎就是问题;当我删除这个div时，所以我将iframe直接放入reveal-modal div中，它正常工作，但显然视频不能在不同的设备上缩放

它在基础4中总是运行良好，但现在在基础5中它可以做到这一点。请帮忙。谢谢

Answer 1

为您的揭密模式提供ID（即#myModal）
进入您的foundation.reveal.js文件并查找以下代码行：

close_video：function（e）{ var video = $（this）.find（'。flex-video'）， iframe = video.find（'＃myModal iframe'）;
如您所见，在第三行代码中我添加了#myModal的ID
打开foundation.min.js并找到（命令+ f）两个iframe引用，并将您的ID（#myModal）添加到

柔性视频显示只显示一次

1 个答案: