OLD | NEW |
| (Empty) |
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" | |
2 "http://www.w3.org/TR/html4/loose.dtd"> | |
3 | |
4 <html lang="en"> | |
5 <head> | |
6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | |
7 <title>Test of font-size Animation Using em Units</title> | |
8 <style type="text/css" media="screen"> | |
9 body { | |
10 font-family: "arial"; | |
11 font-size: 10px; | |
12 } | |
13 | |
14 #box { | |
15 position: absolute; | |
16 left: 0; | |
17 top: 100px; | |
18 height: 250px; | |
19 width: 400px; | |
20 border: 1px solid black; | |
21 animation-duration: 1s; | |
22 animation-timing-function: linear; | |
23 animation-name: anim; | |
24 } | |
25 @keyframes anim { | |
26 from { font-size: 1em; } | |
27 to { font-size: 2em; } | |
28 } | |
29 </style> | |
30 <script type="text/javascript" charset="utf-8"> | |
31 if (window.testRunner) { | |
32 testRunner.dumpAsText(); | |
33 testRunner.waitUntilDone(); | |
34 } | |
35 | |
36 result = "PASS"; | |
37 const defaultTolerance = 1; | |
38 | |
39 function isEqual(actual, desired, tolerance) | |
40 { | |
41 if (tolerance == undefined || tolerance == 0) | |
42 tolerance = defaultTolerance; | |
43 var diff = Math.abs(actual - desired); | |
44 return diff < tolerance; | |
45 } | |
46 | |
47 function snapshot(expected) | |
48 { | |
49 if (result != "PASS") | |
50 return; | |
51 | |
52 var fontSize = parseInt(window.getComputedStyle(document.getElementById(
'box')).fontSize); | |
53 if (!isEqual(fontSize, expected)) { | |
54 result = "FAIL(was:"+fontSize+", expected:"+expected+")"; | |
55 } | |
56 } | |
57 | |
58 function start() | |
59 { | |
60 setTimeout("snapshot(13)", 333); | |
61 | |
62 window.setTimeout(function() { | |
63 document.getElementById('result').innerHTML = result; | |
64 if (window.testRunner) | |
65 testRunner.notifyDone(); | |
66 }, 400); | |
67 } | |
68 | |
69 document.addEventListener('animationstart', start, false); | |
70 | |
71 </script> | |
72 </head> | |
73 <body> | |
74 This test performs an animation of the font-size property using 'em' units. It t
ests whether or not we are properly | |
75 getting the default font-size. | |
76 <div id="box"> | |
77 Here is some text. Here is some text. Here is some text. Here is some text. Here
is some text. Here is some text. | |
78 Here is some text. Here is some text. Here is some text. Here is some text. Here
is some text. Here is some text. | |
79 </div> | |
80 <div id="result"> | |
81 </div> | |
82 </body> | |
83 </html> | |
OLD | NEW |