html5-video - video.js 动态设置

标签 html5-video video.js

我需要使用javascript(没有标签)通过下面的简单代码来设置videojs,但是css似乎没有正确加载,作为HTML方式,正确的方法是什么?

<!DOCTYPE html>
<html>
<head>
  <title>test</title>
  <link href="http://vjs.zencdn.net/5.0/video-js.css" rel="stylesheet" type="text/css">
  <script src="http://vjs.zencdn.net/ie8/1.1.0/videojs-ie8.min.js"></script>
  <script src="http://vjs.zencdn.net/5.0/video.js"></script>
</head>
<body>
  <div id="videoarea"></div>
  <script>
		var container = document.getElementById("videoarea");
		videojs(container, {
			controls: true,
			class:'video-js vjs-default-skin',
			techOrder: ["html5", "flash"],
			source: {
				type : 'rtmp/mp4',
				src : 'rtmp://live.hkstv.hk.lxdns.com/live/hks'
			}
		}, function() {
		});
	</script>
</body>
</html>

最佳答案

您必须在页面上包含 html5 视频标记。这可确保正确的设备回退,并且是 videojs 正确加载所必需的。

<!DOCTYPE html>
<html>
<head>
  <title>test</title>
  <link href="http://vjs.zencdn.net/5.0/video-js.css" rel="stylesheet" type="text/css">
  <script src="http://vjs.zencdn.net/ie8/1.1.0/videojs-ie8.min.js"></script>
  <script src="http://vjs.zencdn.net/5.0/video.js"></script>
</head>
<body>
  <video id="videoarea" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" width="640" height="264"> </video>
  <script>
        var container = document.getElementById("videoarea");
        videojs(container, {
            controls: true,
            class:'video-js vjs-default-skin',
            techOrder: ["html5", "flash"],
            source: {
                type : 'rtmp/mp4',
                src : 'rtmp://live.hkstv.hk.lxdns.com/live/hks'
            }
        }, function() {
        });
    </script>
</body>
</html>

关于html5-video - video.js 动态设置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33665340/

相关文章:

javascript - 流行的 Big Buck Bunny mp4 视频上的 "Cannot play media. No decoders for requested formats"

javascript - 如何解决 Swiper 和 Video.Js 之间的事件冲突

iphone - 如何更改视频方向

javascript - VideoJS-IMA 插件 - 在 2 个或更多视频后播放 PostRoll 广告

css - 响应式全屏 HTML5 视频问题

ios - Apple 针对内联视频播放器的 iOS 政策是什么?

javascript - 加载时在特定位置启动 HTML5 视频?

html - 将实时视频从网站流式传输到 restream-server

javascript - 操作在 componentDidMount 内不起作用

javascript - 如何更改videojs控制栏元素顺序的位置