Question

我在这里有一个JSFiddle - http://jsfiddle.net/n90Lexgc/

我正在使用bootstrap模式来加载vimeo视频。

我添加了CSS以使视频更大且响应更快。

我的问题是我在视频中丢失了播放按钮。

如果我点击它播放和停止的视频，但我没有播放按钮。

        <!-- video player -->
            <div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content embed-responsive embed-responsive-16by9">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                        </div>
                        <div class="modal-body">

                          <iframe width="1000" height="528" frameborder="0" allowfullscreen="" class="embed-responsive-item"></iframe>

                        </div>
                    </div>
                </div>
            </div>
            <!-- video player -->

            <div class="container-fluid">
                <div clas="row">

                    <button class="js-play" data-vid="105100455">Video</button>

                </div>  

            </div>

Answer 1

并不是说你的按钮丢失了，它们只是推得太远而你无法看到它们。

你需要从你的模态体中剪掉一些填充物。

.modal-body {
    ...
    padding-bottom: 49%;
    ...
}

<强> JSFiddle

Bootstrap模态vimeo播放按钮

1 个答案: