1

当用户通过 PHP 剪辑一段视频时,我们会动态生成缩略图。

为了做到这一点,当部分被剪辑时,我们通过 ajax 向服务器发送一些信息,它调用 ffmpeg 生成缩略图,然后在生成缩略图时最终返回给我们,因此我们可以使用 twitter 在视频剪辑器下方显示它引导程序的缩略图。

这是用户在等待缩略图时看到的基本示例:http: //jsfiddle.net/Rnt9N/2/

显然不好,看起来很乱。所以我们想要的是让微调器在水平和垂直方向上居中,并且还可以缩放(因为缩略图是响应式的,我们需要微调器能够增长)。

这只是基本的 htmt,但显然我需要在此处包含代码:

<div class="container-fluid">
<div class="row-fluid">
    <div class="span12">
        <ul class="thumbnails">
            <li class="span2"><a href="#" class="thumbnail">
                    <i class="icon icon-spin icon-spinner"></i>
                </a>

            </li>
            <li class="span2"><a href="#" class="thumbnail">
                    <img src="http://placehold.it/260x180" alt="">
                </a>

            </li>
            <li class="span2"><a href="#" class="thumbnail">
                    <img src="http://placehold.it/260x180" alt="">
                </a>

            </li>
            <li class="span2"><a href="#" class="thumbnail">
                    <img src="http://placehold.it/260x180" alt="">
                </a>

            </li>
            <li class="span2"><a href="#" class="thumbnail">
                    <img src="http://placehold.it/260x180" alt="">
                </a>

            </li>
            <li class="span2"><a href="#" class="thumbnail">
                    <img src="http://placehold.it/260x180" alt="">
                </a>

            </li>
            <li class="span2"><a href="#" class="thumbnail">
                    <img src="http://placehold.it/260x180" alt="">
                </a>

            </li>
            <li class="span2"><a href="#" class="thumbnail">
                    <img src="http://placehold.it/260x180" alt="">
                </a>

            </li>
            <li class="span2"><a href="#" class="thumbnail">
                    <img src="http://placehold.it/260x180" alt="">
                </a>

            </li>
        </ul>
    </div>
</div>
</div>
4

0 回答 0