我正在尝试制作一个带有按钮的视频播放器,以快进,快退,暂停和前进一帧 .
我熟悉如何使用javascript使它们工作的理论 - 并且已经构建了一些,当然是略微错误的按钮,它们与播放器分开,当我全屏播放时无法看到 . 为清楚起见,我有 <button>
元素和jquery脚本位于视频下但没有附加到它上面 .
有没有办法将这些按钮注入html5 <video>
标签的 controls
元素,以便它们持久存在,用户可以在全屏时享受这些按钮的使用 .
或者作为附录 - 是否有人知道如何确保快速转发脚本等,他们从控件中获取本机暂停功能,如果不是这只意味着我的代码可能是 crap
.
1 回答
据我所知,HTML5视频播放器控件不能直接设置样式 .
我找到的解决方案要求您包含自定义控件并禁用默认控件:
http://blog.teamtreehouse.com/building-custom-controls-for-html5-videos
http://mrbool.com/how-to-style-the-html-5-video-element-with-javascript-and-css/27683
我还认为完全替换默认控件会比在加载后尝试注入新按钮更好地控制和更稳定 . 使用标准控件没有任何好处,它们是纯HTML,CSS和javascript,并使用与构建自己的版本相同的方法 .
至于快进,视频元素有一个非常好用的playbackrate attribute . 如果你确保你的控件正确实现了这个方法,你就可以了 .