2008-12-10 Pierre-Olivier Latour <pol@apple.com>
[WebKit-https.git] / LayoutTests / animations / animation-drt-api-multiple-keyframes.html
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   <style>
8     body {
9       margin: 0;
10     }
11     
12     div {
13       position: relative;
14       left: 100px;
15       height: 200px;
16       width: 200px;
17       background-color: red;
18       -webkit-animation-name: anim;
19       -webkit-animation-duration: 5s;
20       -webkit-animation-timing-function: linear;
21     }
22
23     @-webkit-keyframes anim {
24       from { left: 10px; }
25       40% { left: 30px; }
26       60% { left: 15px; }
27       to { left: 20px; }
28     }
29          
30      </style>
31    <script type="text/javascript" charset="utf-8">
32     function startTest() {
33       if (window.layoutTestController) {
34         if (!layoutTestController.pauseAnimationAtTimeOnElementWithId("anim", 3, "box"))
35           throw("Animation is not running");
36       }
37     }
38    </script>
39 </head>
40 <body onload="startTest()">
41   <h1>Test for DRT pauseAnimationAtTimeOnElementWithId() API on animations with multiple keyframes</h1>
42
43   <div id="box">
44   </div>
45
46 </body>
47 </html>