2011-09-30 17:28:43 -07:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8" />
|
|
|
|
|
<title>HTML5 Video Player</title>
|
|
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../design/video-js.css" type="text/css">
|
|
|
|
|
<!--[if lt IE 9]>
|
|
|
|
|
<script>
|
|
|
|
|
document.createElement("video"); // HTML5 Shiv. Must be in <head>.
|
|
|
|
|
</script>
|
|
|
|
|
<![endif]-->
|
|
|
|
|
|
|
|
|
|
<!--[if IE]>
|
|
|
|
|
<script src="https://getfirebug.com/firebug-lite.js" type="text/javascript" charset="utf-8"></script>
|
|
|
|
|
<![endif]-->
|
|
|
|
|
|
|
|
|
|
|
2011-12-07 16:44:21 -08:00
|
|
|
<script src="../src/core.js"></script>
|
|
|
|
|
<script src="../src/lib.js"></script>
|
|
|
|
|
<script src="../src/ecma.js"></script>
|
|
|
|
|
<script src="../src/json.js"></script>
|
2011-09-30 17:28:43 -07:00
|
|
|
|
2011-12-07 16:44:21 -08:00
|
|
|
<script src="../src/component.js"></script>
|
|
|
|
|
<script src="../src/player.js"></script>
|
|
|
|
|
<script src="../src/tech.js"></script>
|
|
|
|
|
<script src="../src/controls.js"></script>
|
|
|
|
|
<script src="../src/events.js"></script>
|
|
|
|
|
<script src="../src/tracks.js"></script>
|
2011-09-30 17:28:43 -07:00
|
|
|
|
2011-12-07 16:44:21 -08:00
|
|
|
<script src="../flash/swfobject.js"></script>
|
2011-09-30 17:28:43 -07:00
|
|
|
|
|
|
|
|
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
|
|
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="compare.css" type="text/css">
|
|
|
|
|
<script type="text/javascript" src="compare.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
2011-12-07 16:44:21 -08:00
|
|
|
<div id="main">
|
2011-09-30 17:28:43 -07:00
|
|
|
<table border="0" cellspacing="5" cellpadding="5">
|
2011-12-07 21:03:12 -08:00
|
|
|
<tr><th colspan="2">HTML5</th><th colspan="2">Flash</th></tr>
|
2011-09-30 17:28:43 -07:00
|
|
|
<tr>
|
|
|
|
|
<td colspan="2">
|
2011-11-21 17:19:31 -08:00
|
|
|
<video id="vid1" class="video-js vjs-default-skin" controls preload="auto" width="480" height="198"
|
2011-11-17 16:54:02 -08:00
|
|
|
poster="http://video-js.zencoder.com/oceans-clip.png">
|
2011-09-30 17:28:43 -07:00
|
|
|
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'>
|
2011-11-21 17:19:31 -08:00
|
|
|
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'>
|
2011-09-30 17:28:43 -07:00
|
|
|
</video>
|
|
|
|
|
</td>
|
|
|
|
|
<td colspan="2">
|
2011-11-21 17:19:31 -08:00
|
|
|
<video id="vid2" class="video-js vjs-default-skin" controls preload="auto" width="480" height="198"
|
2011-10-03 10:25:02 -07:00
|
|
|
poster="http://video-js.zencoder.com/oceans-clip.png">
|
2011-09-30 17:28:43 -07:00
|
|
|
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'>
|
2011-11-18 15:53:00 -08:00
|
|
|
<!-- <source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'> -->
|
2011-09-30 17:28:43 -07:00
|
|
|
</video>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td class="info-col">
|
|
|
|
|
<table id="html5_props" border="0" cellspacing="0" cellpadding="0"></table>
|
|
|
|
|
</td>
|
|
|
|
|
<td class="info-col">
|
|
|
|
|
<div id="html5_events"></div>
|
|
|
|
|
</td>
|
|
|
|
|
<td class="info-col">
|
2011-12-07 21:03:12 -08:00
|
|
|
<table id="flash_props" border="0" cellspacing="0" cellpadding="0"></table>
|
2011-09-30 17:28:43 -07:00
|
|
|
</td>
|
|
|
|
|
<td class="info-col">
|
2011-12-07 21:03:12 -08:00
|
|
|
<div id="flash_events"></div>
|
2011-09-30 17:28:43 -07:00
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
</table>
|
2011-12-07 16:44:21 -08:00
|
|
|
</div>
|
2011-09-30 17:28:43 -07:00
|
|
|
</body>
|
|
|
|
|
</html>
|
