Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(428)

Side by Side Diff: LayoutTests/transitions/first-letter-transition.html

Issue 10696154: Merge 120639 (Closed) Base URL: http://svn.webkit.org/repository/webkit/branches/chromium/1180/
Patch Set: Created 8 years, 5 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <html>
2 <head>
3 <style type="text/css" media="screen">
4 .box {
5 position: relative;
6 width: 100px;
7 height: 100px;
8 left: 100px;
9 background-color: blue;
10 }
11
12 .box::first-letter {
13 font-size: 24pt;
14 color: black;
15 -webkit-transition: color 0.1s 0.1s;
16 }
17
18 #first {
19 -webkit-transition: left 0.1s 0.15s;
20 }
21
22 #second {
23 -webkit-transition: all 0.1s 0.2s;
24 }
25
26 .animating #first {
27 left: 400px;
28 }
29
30 .animating #second {
31 -webkit-transform: rotate(360deg);
32 color: purple;
33 }
34
35 .animating *::first-letter {
36 color: white;
37 }
38
39
40 </style>
41 <script src="resources/transition-test-helpers.js"></script>
42 <script type="text/javascript" charset="utf-8">
43 if (window.testRunner) {
44 testRunner.dumpAsText();
45 testRunner.waitUntilDone();
46 }
47
48 var result = "Transtions test result: <br><br>";
49 var transitions = 0;
50 function transitionEnded(event)
51 {
52 if ((event.propertyName == "color") || (event.propertyName == "left") || (event.propertyName == "-webkit-transform"))
53 result += "PASS <br>";
54 else
55 result += "FAIL <br>";
56
57 ++transitions;
58
59 if (transitions == 5) {
60 document.getElementById('result').innerHTML = result;
61 if (window.testRunner)
62 testRunner.notifyDone();
63 }
64 }
65
66 window.addEventListener( 'webkitTransitionEnd', transitionEnded, false );
67
68 window.addEventListener("load", function () {
69 document.getElementById('container').className = 'animating';
70 }, false);
71 </script>
72 </head>
73 <body>
74 <div id="container">
75 <div id="first" class="box">
76 Box One
77 </div>
78 <div id="second" class="box">
79 Box two
80 </div>
81 </div>
82 <div id="result">
83 </div>
84 </body>
85 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698