|
1 <!DOCTYPE HTML> |
|
2 <html> |
|
3 <head> |
|
4 <title>Video Discovery Test</title> |
|
5 <style type="text/css"> |
|
6 #video-box { |
|
7 float: left; |
|
8 } |
|
9 #video-overlay, #video-player { |
|
10 width: 640px; |
|
11 min-height: 370px; |
|
12 } |
|
13 #video-overlay { |
|
14 position: absolute; |
|
15 float: left; |
|
16 background-color:#f00; |
|
17 z-index:10; |
|
18 } |
|
19 </style> |
|
20 </head> |
|
21 <body> |
|
22 <!-- PASS: src uses a mp4 extension --> |
|
23 <video id="simple-mp4" poster="/simple.png" src="/simple.mp4"></video> |
|
24 |
|
25 <!-- FAIL: src uses a ogg extension --> |
|
26 <video id="simple-fail" src="/simple.ogg"></video> |
|
27 |
|
28 <!-- PASS: source list uses a mp4 extension --> |
|
29 <video id="with-sources-mp4"> |
|
30 <source src="/simple.ogg"> |
|
31 <source src="/simple.mp4"> |
|
32 </video> |
|
33 |
|
34 <!-- FAIL: source list uses a mp4 extension --> |
|
35 <video id="with-sources-fail"> |
|
36 <source src="/simple.ogg"> |
|
37 <source src="/simple.webm"> |
|
38 </video> |
|
39 |
|
40 <!-- PASS: source list uses a mp4 mimetype --> |
|
41 <video id="with-sources-mimetype"> |
|
42 <source src="/simple-video-ogg" type="video/ogg"> |
|
43 <source src="/simple-video-mp4" type="video/mp4"> |
|
44 </video> |
|
45 |
|
46 <!-- PASS: source list uses a mp4 mimetype and extra data --> |
|
47 <video id="with-sources-mimetype-plus"> |
|
48 <source src="/simple-video-ogg" type="video/ogg"> |
|
49 <source src="/simple-video-mp4" type="video/mp4; codecs='avc1.42E01E, mp4a.40.2'"> |
|
50 </video> |
|
51 |
|
52 <!-- PASS: div overlay covers a video with mp4 src --> |
|
53 <div id="video-box"> |
|
54 <div id="video-overlay"></div> |
|
55 <div> |
|
56 <video id="video-player" src="/simple.mp4"></video> |
|
57 </div> |
|
58 </div> |
|
59 </body> |
|
60 </html> |