mirror of
https://github.com/servo/servo.git
synced 2025-09-06 04:58:21 +01:00
Update web-platform-tests to revision fec3928f355e049657d19780aa4b412d9d3a714b
This commit is contained in:
parent
74ba683e27
commit
2a8d9b6983
153 changed files with 3075 additions and 719 deletions
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering, align:middle</title>
|
||||
<title>Reference for WebVTT rendering, align:center</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering, align:middle</title>
|
||||
<link rel="match" href="align_middle-ref.html">
|
||||
<title>WebVTT rendering, align:center</title>
|
||||
<link rel="match" href="align_center-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
|
@ -14,7 +14,7 @@ body { margin:0 }
|
|||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="/media/white.webm" type="video/webm">
|
||||
<source src="/media/white.mp4" type="video/mp4">
|
||||
<track src="support/align_middle.vtt">
|
||||
<track src="support/align_center.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering, align:middle, position:50%</title>
|
||||
<title>Reference for WebVTT rendering, align:center, position:50%</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering, align:middle, position:50%</title>
|
||||
<link rel="match" href="align_middle_position_50-ref.html">
|
||||
<title>WebVTT rendering, align:center, position:50%</title>
|
||||
<link rel="match" href="align_center_position_50-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
|
@ -14,7 +14,7 @@ body { margin:0 }
|
|||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="/media/white.webm" type="video/webm">
|
||||
<source src="/media/white.mp4" type="video/mp4">
|
||||
<track src="support/align_middle_position_50.vtt">
|
||||
<track src="support/align_center_position_50.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering, align:middle, position greater than 50%</title>
|
||||
<title>Reference for WebVTT rendering, align:center, position greater than 50%</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering, align:middle, position greater than 50%</title>
|
||||
<link rel="match" href="align_middle_position_gt_50-ref.html">
|
||||
<title>WebVTT rendering, align:center, position greater than 50%</title>
|
||||
<link rel="match" href="align_center_position_gt_50-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
|
@ -14,7 +14,7 @@ body { margin:0 }
|
|||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="/media/white.webm" type="video/webm">
|
||||
<source src="/media/white.mp4" type="video/mp4">
|
||||
<track src="support/align_middle_position_gt_50.vtt">
|
||||
<track src="support/align_center_position_gt_50.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering, align:middle, position less than 50%</title>
|
||||
<title>Reference for WebVTT rendering, align:center, position less than 50%</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering, align:middle, position less than 50%</title>
|
||||
<link rel="match" href="align_middle_position_lt_50-ref.html">
|
||||
<title>WebVTT rendering, align:center, position less than 50%</title>
|
||||
<link rel="match" href="align_center_position_lt_50-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
|
@ -14,7 +14,7 @@ body { margin:0 }
|
|||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="/media/white.webm" type="video/webm">
|
||||
<source src="/media/white.mp4" type="video/mp4">
|
||||
<track src="support/align_middle_position_lt_50.vtt">
|
||||
<track src="support/align_center_position_lt_50.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering, align:middle, position less than 50%, size greater than maximum size</title>
|
||||
<title>Reference for WebVTT rendering, align:center, position less than 50%, size greater than maximum size</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering, align:middle, position less than 50%, size greater than maximum size</title>
|
||||
<link rel="match" href="align_middle_position_lt_50_size_gt_maximum_size-ref.html">
|
||||
<title>WebVTT rendering, align:center, position less than 50%, size greater than maximum size</title>
|
||||
<link rel="match" href="align_center_position_lt_50_size_gt_maximum_size-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
|
@ -14,7 +14,7 @@ body { margin:0 }
|
|||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="/media/white.webm" type="video/webm">
|
||||
<source src="/media/white.mp4" type="video/mp4">
|
||||
<track src="support/align_middle_position_lt_50_size_gt_maximum_size.vtt">
|
||||
<track src="support/align_center_position_lt_50_size_gt_maximum_size.vtt">
|
||||
</video>
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering, align:middle with long cues</title>
|
||||
<title>Reference for WebVTT rendering, align:center with long cues</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
|
@ -1,7 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering, align:middle with long cues</title>
|
||||
<link rel="match" href="align_middle_wrapped-ref.html">
|
||||
<title>WebVTT rendering, align:center with long cues</title>
|
||||
<link rel="match" href="align_center_wrapped-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
|
@ -14,7 +14,7 @@ body { margin:0 }
|
|||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="/media/white.webm" type="video/webm">
|
||||
<source src="/media/white.mp4" type="video/mp4">
|
||||
<track src="support/align_middle_long.vtt">
|
||||
<track src="support/align_center_long.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering regions, default</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
.video {
|
||||
display: inline-block;
|
||||
width: 320px;
|
||||
height: 180px;
|
||||
position: relative;
|
||||
font-size: 9px;
|
||||
}
|
||||
.cue {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: center
|
||||
}
|
||||
.cue > span {
|
||||
font-family: Ahem, sans-serif;
|
||||
background: rgba(0,0,0,0.8);
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<div class="video"><span class="cue"><span>This is a test subtitle</span></span></div>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering regions, default</title>
|
||||
<link rel="match" href="basic-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
::cue {
|
||||
font-family: Ahem, sans-serif;
|
||||
color: green
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="../media/white.webm" type="video/webm">
|
||||
<source src="../media/white.mp4" type="video/mp4">
|
||||
<track src="support/basic.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
||||
</video>
|
||||
</html>
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering regions, regionanchor x 50%</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
.video {
|
||||
display: inline-block;
|
||||
width: 320px;
|
||||
height: 180px;
|
||||
position: relative;
|
||||
font-size: 9px;
|
||||
}
|
||||
.cue {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: -50%;
|
||||
right: 50%;
|
||||
text-align: center
|
||||
}
|
||||
.cue > span {
|
||||
font-family: Ahem, sans-serif;
|
||||
background: rgba(0,0,0,0.8);
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<div class="video"><span class="cue"><span>This is a test subtitle</span></span></div>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering regions, regionanchor x 50%</title>
|
||||
<link rel="match" href="regionanchor_x_50_percent-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
::cue {
|
||||
font-family: Ahem, sans-serif;
|
||||
color: green
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="../media/white.webm" type="video/webm">
|
||||
<source src="../media/white.mp4" type="video/mp4">
|
||||
<track src="support/regionanchor_x_50_percent.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
||||
</video>
|
||||
</html>
|
|
@ -0,0 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering regions, regionanchor y 50%</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
</style>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering regions, regionanchor y 50%</title>
|
||||
<link rel="match" href="regionanchor_y_50_percent-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
::cue {
|
||||
font-family: Ahem, sans-serif;
|
||||
color: green
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="../media/white.webm" type="video/webm">
|
||||
<source src="../media/white.mp4" type="video/mp4">
|
||||
<track src="support/regionanchor_y_50_percent.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
||||
</video>
|
||||
</html>
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering regions, scroll up</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
.video {
|
||||
display: inline-block;
|
||||
width: 320px;
|
||||
height: 180px;
|
||||
position: relative;
|
||||
font-size: 9px;
|
||||
}
|
||||
.cue {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: center
|
||||
}
|
||||
.cue > span {
|
||||
font-family: Ahem, sans-serif;
|
||||
background: rgba(0,0,0,0.8);
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<div class="video"><span class="cue"><span>This is a second test subtitle<br/>This is a third test subtitle</span></span></div>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering regions, scroll up</title>
|
||||
<link rel="match" href="scroll_up-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
::cue {
|
||||
font-family: Ahem, sans-serif;
|
||||
color: green
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshotDelayed(3000);">
|
||||
<source src="../media/white.webm" type="video/webm">
|
||||
<source src="../media/white.mp4" type="video/mp4">
|
||||
<track src="support/scroll_up.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
||||
</video>
|
||||
</html>
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering regions, single line top left</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
.video {
|
||||
display: inline-block;
|
||||
width: 320px;
|
||||
height: 180px;
|
||||
position: relative;
|
||||
font-size: 9px;
|
||||
}
|
||||
.cue {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: left
|
||||
}
|
||||
.cue > span {
|
||||
font-family: Ahem, sans-serif;
|
||||
background: rgba(0,0,0,0.8);
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<div class="video"><span class="cue"><span>This is a test subtitle</span></span></div>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering regions, single line top left</title>
|
||||
<link rel="match" href="single_line_top_left-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
::cue {
|
||||
font-family: Ahem, sans-serif;
|
||||
color: green
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="../media/white.webm" type="video/webm">
|
||||
<source src="../media/white.mp4" type="video/mp4">
|
||||
<track src="support/single_line_top_left.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
||||
</video>
|
||||
</html>
|
|
@ -0,0 +1,7 @@
|
|||
WEBVTT
|
||||
|
||||
REGION
|
||||
id:1
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 region:1
|
||||
This is a test subtitle
|
|
@ -0,0 +1,8 @@
|
|||
WEBVTT
|
||||
|
||||
REGION
|
||||
id:1
|
||||
regionanchor:50%,100%
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 region:1
|
||||
This is a test subtitle
|
|
@ -0,0 +1,8 @@
|
|||
WEBVTT
|
||||
|
||||
REGION
|
||||
id:1
|
||||
regionanchor:0%,50%
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 region:1
|
||||
This is a test subtitle
|
|
@ -0,0 +1,16 @@
|
|||
WEVTT
|
||||
|
||||
REGION
|
||||
id:1
|
||||
lines:2
|
||||
regionanchor:0%,0%
|
||||
scroll:up
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 region:1
|
||||
This is a first test subtitle
|
||||
|
||||
00:00:01.000 --> 00:00:05.000 region:1
|
||||
This is a second test subtitle
|
||||
|
||||
00:00:01.000 --> 00:00:05.000 region:1
|
||||
This is a third test subtitle
|
|
@ -0,0 +1,10 @@
|
|||
WEBVTT
|
||||
|
||||
REGION
|
||||
id:1
|
||||
viewportanchor:0%,0%
|
||||
regionanchor:0%,0%
|
||||
lines:1
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 region:1 align:left
|
||||
This is a test subtitle
|
|
@ -0,0 +1,8 @@
|
|||
WEBVTT
|
||||
|
||||
REGION
|
||||
id:1
|
||||
viewportanchor:50%,100%
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 region:1
|
||||
This is a test subtitle
|
|
@ -0,0 +1,8 @@
|
|||
WEBVTT
|
||||
|
||||
REGION
|
||||
id:1
|
||||
viewportanchor:0%,50%
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 region:1
|
||||
This is a test subtitle
|
|
@ -0,0 +1,8 @@
|
|||
WEBVTT
|
||||
|
||||
REGION
|
||||
id:1
|
||||
width:50%
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 region:1
|
||||
This is a test subtitle
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering regions, viewportanchor x 50%</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
.video {
|
||||
display: inline-block;
|
||||
width: 320px;
|
||||
height: 180px;
|
||||
position: relative;
|
||||
font-size: 9px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.cue {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
right: -50%;
|
||||
text-align: center
|
||||
}
|
||||
.cue > span {
|
||||
font-family: Ahem, sans-serif;
|
||||
background: rgba(0,0,0,0.8);
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<div class="video"><span class="cue"><span>This is a test subtitle</span></span></div>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering regions, viewportanchor x 50%</title>
|
||||
<link rel="match" href="viewportanchor_x_50_percent-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
::cue {
|
||||
font-family: Ahem, sans-serif;
|
||||
color: green
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="../media/white.webm" type="video/webm">
|
||||
<source src="../media/white.mp4" type="video/mp4">
|
||||
<track src="support/viewportanchor_x_50_percent.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
||||
</video>
|
||||
</html>
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering regions, viewportanchor y 50%</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
.video {
|
||||
display: inline-block;
|
||||
width: 320px;
|
||||
height: 180px;
|
||||
position: relative;
|
||||
font-size: 9px;
|
||||
}
|
||||
.cue {
|
||||
position: absolute;
|
||||
bottom: 50%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: center
|
||||
}
|
||||
.cue > span {
|
||||
font-family: Ahem, sans-serif;
|
||||
background: rgba(0,0,0,0.8);
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<div class="video"><span class="cue"><span>This is a test subtitle</span></span></div>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering regions, viewportanchor y 50%</title>
|
||||
<link rel="match" href="viewportanchor_y_50_percent-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
::cue {
|
||||
font-family: Ahem, sans-serif;
|
||||
color: green
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="../media/white.webm" type="video/webm">
|
||||
<source src="../media/white.mp4" type="video/mp4">
|
||||
<track src="support/viewportanchor_y_50_percent.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
||||
</video>
|
||||
</html>
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for WebVTT rendering regions, width 50%</title>
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
.video {
|
||||
display: inline-block;
|
||||
width: 320px;
|
||||
height: 180px;
|
||||
position: relative;
|
||||
font-size: 9px;
|
||||
}
|
||||
.cue {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 50%;
|
||||
text-align: center
|
||||
}
|
||||
.cue > span {
|
||||
font-family: Ahem, sans-serif;
|
||||
background: rgba(0,0,0,0.8);
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<div class="video"><span class="cue"><span>This is a test subtitle</span></span></div>
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<title>WebVTT rendering regions, width 50%</title>
|
||||
<link rel="match" href="width_50_percent-ref.html">
|
||||
<style>
|
||||
html { overflow:hidden }
|
||||
body { margin:0 }
|
||||
::cue {
|
||||
font-family: Ahem, sans-serif;
|
||||
color: green
|
||||
}
|
||||
</style>
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<video width="320" height="180" autoplay onplaying="this.onplaying = null; this.pause(); takeScreenshot();">
|
||||
<source src="../media/white.webm" type="video/webm">
|
||||
<source src="../media/white.mp4" type="video/mp4">
|
||||
<track src="support/width_50_percent.vtt">
|
||||
<script>
|
||||
document.getElementsByTagName('track')[0].track.mode = 'showing';
|
||||
</script>
|
||||
</video>
|
||||
</html>
|
|
@ -0,0 +1,4 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:center
|
||||
This is a test
|
|
@ -1,4 +1,4 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:middle
|
||||
00:00:00.000 --> 00:00:05.000 align:center
|
||||
This is a test subtitle that most likely will span over several rows since it is a pretty long cue with a lot of text.
|
|
@ -0,0 +1,4 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:center position:50%
|
||||
This is a test
|
|
@ -0,0 +1,4 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:center position:90%
|
||||
Awesome!!!
|
|
@ -0,0 +1,4 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:center position:10%
|
||||
Awesome!!!
|
|
@ -0,0 +1,4 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:center position:10% size:75%
|
||||
Awesome!!!
|
|
@ -1,4 +0,0 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:middle
|
||||
This is a test
|
|
@ -1,4 +0,0 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:middle position:50%
|
||||
This is a test
|
|
@ -1,4 +0,0 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:middle position:90%
|
||||
Awesome!!!
|
|
@ -1,4 +0,0 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:middle position:10%
|
||||
Awesome!!!
|
|
@ -1,4 +0,0 @@
|
|||
WEBVTT
|
||||
|
||||
00:00:00.000 --> 00:00:05.000 align:middle position:10% size:75%
|
||||
Awesome!!!
|
Loading…
Add table
Add a link
Reference in a new issue