Question

我需要使用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>

Answer 1

您必须在页面上添加html5视频标记。这确保了正确的设备回退，并且视频js需要正确加载。

<!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>

video.js动态设置

1 个答案: