我的VideoJS播放器搞砸了

时间:2016-06-24 17:13:20

标签: css wordpress html5 video.js

我是通过互联网学习CSS和HTML的新手,我将主持一个卡通网站,但事实上对wordpress一无所知。

这是我的问题

http://i.stack.imgur.com/qVaYv.jpg

http://i.stack.imgur.com/vouqa.png

你可以看到我的玩家在我开始时搞砸了,并且为什么在这里找到代码

<video id="video" class="video-js" width="1000" height="500" controls preload="auto" poster="https://i.ytimg.com/vi/MmeAPpEoGAI/maxresdefault.jpg" controls data-setup='{}'>
   <source src="https://lh3.googleusercontent.com/vvT0ZbARuW8E17sX9MbpbFJ81fe_p_TlzSPSWwn3bVVXzPeN6bMsW3h0YsUaAsoxyw5dGkKAHBw=m18" type='video/mp4' label='360p' />
   <source src="https://lh3.googleusercontent.com/vvT0ZbARuW8E17sX9MbpbFJ81fe_p_TlzSPSWwn3bVVXzPeN6bMsW3h0YsUaAsoxyw5dGkKAHBw=m22" type='video/mp4' label='720p'/>
   <source src="https://lh3.googleusercontent.com/vvT0ZbARuW8E17sX9MbpbFJ81fe_p_TlzSPSWwn3bVVXzPeN6bMsW3h0YsUaAsoxyw5dGkKAHBw=m37" type='video/mp4' label='1080p'/>
</video>
<script>
  videojs('video').videoJsResolutionSwitcher()
</script>
是的,我正在以正确的方式添加videoJS吗? [我在主题的header.php中添加了这个]

<head>
<link href="http://vjs.zencdn.net/5.10.4/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/5.10.4/video.js"></script>
<link href="http://127.0.0.1/videojs-resolution-switcher.css" rel="stylesheet">
<script src="http://127.0.0.1/videojs-resolution-switcher.js"></script>

播放器显示来自videojs.com的expamle

1 个答案:

答案 0 :(得分:0)

尝试更改样式表顺序

将videojs样式<link href="http://vjs.zencdn.net/5.10.4/video-js.css" rel="stylesheet">文件放在样式表队列的末尾(<head>部分中的最后一个)

您的模板样式似乎会覆盖videojs样式