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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: third_party/WebKit/ManualTests/win/milliondollar.html

Issue 2715113003: CSS manual tests: reduce usage of webkit prefix (Closed)
Patch Set: Created 3 years, 9 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
« no previous file with comments | « third_party/WebKit/ManualTests/transitions.html ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <html xmlns="http://www.w3.org/1999/xhtml">
4 <head> 4 <head>
5 <title>Million dollar test</title> 5 <title>Million dollar test</title>
6 <style type="text/css" media="screen"> 6 <style type="text/css" media="screen">
7 body { 7 body {
8 padding: 0px; margin: 0px; font-size: 12px; font-family:"Lucida Grande", Verdana, Arial, sans-serif; 8 padding: 0px; margin: 0px; font-size: 12px; font-family:"Lucida Grande", Verdana, Arial, sans-serif;
9 background:#303030; 9 background:#303030;
10 } 10 }
11 .ie {text-align: left; width:1000px;position:relative;visibility:hidden;z-in dex:1;} 11 .ie {text-align: left; width:1000px;position:relative;visibility:hidden;z-in dex:1;}
12 .grid {height: 1000px; width:1000px; position:relative;z-index:153;xoverflow :hidden;} 12 .grid {height: 1000px; width:1000px; position:relative;z-index:153;xoverflow :hidden;}
13 .row {background:url(100grid_inv.png) #000;height: 100px; text-align: left; position:relative;width:1000px;z-index:10;} 13 .row {background:url(100grid_inv.png) #000;height: 100px; text-align: left; position:relative;width:1000px;z-index:10;}
14 #lq {width:1000px;position:relative;z-index:0;text-align:left;} 14 #lq {width:1000px;position:relative;z-index:0;text-align:left;}
15 .bz {-webkit-perspective: 1500;-webkit-perspective-origin: 50% 325px;} 15 .bz {perspective: 1500px;perspective-origin: 50% 325px;}
16 .fc {-webkit-transform-style: preserve-3d;transform: rotateY(0deg) ;opacity : 1.0;} 16 .fc {transform-style: preserve-3d;transform: rotateY(0deg) ;opacity: 1.0;}
17 @-webkit-keyframes spin_3d { 17 @keyframes spin_3d {
18 0% { transform: rotateY(0) rotateZ(0); } 18 0% { transform: rotateY(0) rotateZ(0); }
19 33% { transform: rotateY(-20deg) rotateZ(-20deg); } 19 33% { transform: rotateY(-20deg) rotateZ(-20deg); }
20 65% { transform: rotateY(20deg) rotateZ(20deg); } 20 65% { transform: rotateY(20deg) rotateZ(20deg); }
21 100% { transform: rotateY(0deg) rotateZ(0deg); } 21 100% { transform: rotateY(0deg) rotateZ(0deg); }
22 } 22 }
23 .plane > a {display:block;height:100%;width:100%;} 23 .plane > a {display:block;height:100%;width:100%;}
24 .plane { 24 .plane {
25 position: absolute; 25 position: absolute;
26 opacity:0.5; 26 opacity:0.5;
27 background-repeat:no-repeat; 27 background-repeat:no-repeat;
28 -webkit-transition: -webkit-transform 0.3s, opacity 0s;-webkit-backface- visibility: visible;} 28 transition: transform 0.3s, opacity 0s;-webkit-backface-visibility: visi ble;}
29 </style> 29 </style>
30 30
31 <script type="text/javascript"> 31 <script type="text/javascript">
32 function loadBlocks() { 32 function loadBlocks() {
33 document.getElementById("ie").style.visibility = "visible"; 33 document.getElementById("ie").style.visibility = "visible";
34 document.getElementById("ie").className = document.getElementById("ie").clas sName + " bz"; 34 document.getElementById("ie").className = document.getElementById("ie").clas sName + " bz";
35 document.getElementById("grid").className = document.getElementById("grid"). className + " fc"; 35 document.getElementById("grid").className = document.getElementById("grid"). className + " fc";
36 document.getElementById("lq").style.display = "none"; 36 document.getElementById("lq").style.display = "none";
37 37
38 var cubes; 38 var cubes;
(...skipping 67 matching lines...) Expand 10 before | Expand all | Expand 10 after
106 dw = height; 106 dw = height;
107 } 107 }
108 cubes += addBlock(x1,y1,width,height,dw); 108 cubes += addBlock(x1,y1,width,height,dw);
109 } 109 }
110 110
111 function addBlock(x1,y1,xf,qp,dw) 111 function addBlock(x1,y1,xf,qp,dw)
112 { 112 {
113 return "<div class='a_cube'><div class='plane one' style='background-colo r: red;height:"+dw+"px;width:"+dw+"px;top:"+y1+"px;left:"+x1+"px;transform:rotat eY(90deg) rotateZ(-90deg) translateX(0px) translateY(-"+(dw/2)+"px) translateZ(" +(dw/2)+"px) translateY(0px);position:absolute;'></div><div class='plane two' st yle='background-color: blue;height:"+dw+"px;width:"+dw+"px;top:"+y1+"px;left:"+x 1+"px;transform:rotateY(90deg) rotateX(180deg) rotateZ(-90deg) translateX(0px) t ranslateY(-"+(dw/2)+"px) translateZ("+(dw/2)+"px) translateY(0px);position:absol ute;'></div><div class='plane three' style='background-color: green;height:"+dw+ "px;width:"+dw+"px;top:"+y1+"px;left:"+x1+"px;transform:rotateX(-90deg) translat eX(0px) translateZ("+(dw/2)+"px) translateY(-"+(dw/2)+"px);position:absolute;'>< /div><div class='plane four' style='background-color: yellow;height:"+dw+"px;wid th:"+dw+"px;top:"+y1+"px;left:"+x1+"px;transform:rotateY(90deg) rotateX(90deg) r otateZ(-90deg) translateY(-"+(dw/2)+"px) translateX(0px) translateZ("+(dw/2)+"px ) translateY(0px);position:absolute;'></div><div class='plane five' style='backg round-color: gray;height:"+dw+"px;width:"+dw+"px;top:"+y1+"px;left:"+x1+"px;tran sform:rotateY(0deg) translateX(0px) translateZ("+(dw)+"px) translateY(0px);posit ion:absolute;'></div></div>"; 113 return "<div class='a_cube'><div class='plane one' style='background-colo r: red;height:"+dw+"px;width:"+dw+"px;top:"+y1+"px;left:"+x1+"px;transform:rotat eY(90deg) rotateZ(-90deg) translateX(0px) translateY(-"+(dw/2)+"px) translateZ(" +(dw/2)+"px) translateY(0px);position:absolute;'></div><div class='plane two' st yle='background-color: blue;height:"+dw+"px;width:"+dw+"px;top:"+y1+"px;left:"+x 1+"px;transform:rotateY(90deg) rotateX(180deg) rotateZ(-90deg) translateX(0px) t ranslateY(-"+(dw/2)+"px) translateZ("+(dw/2)+"px) translateY(0px);position:absol ute;'></div><div class='plane three' style='background-color: green;height:"+dw+ "px;width:"+dw+"px;top:"+y1+"px;left:"+x1+"px;transform:rotateX(-90deg) translat eX(0px) translateZ("+(dw/2)+"px) translateY(-"+(dw/2)+"px);position:absolute;'>< /div><div class='plane four' style='background-color: yellow;height:"+dw+"px;wid th:"+dw+"px;top:"+y1+"px;left:"+x1+"px;transform:rotateY(90deg) rotateX(90deg) r otateZ(-90deg) translateY(-"+(dw/2)+"px) translateX(0px) translateZ("+(dw/2)+"px ) translateY(0px);position:absolute;'></div><div class='plane five' style='backg round-color: gray;height:"+dw+"px;width:"+dw+"px;top:"+y1+"px;left:"+x1+"px;tran sform:rotateY(0deg) translateX(0px) translateZ("+(dw)+"px) translateY(0px);posit ion:absolute;'></div></div>";
114 } 114 }
115 115
116 document.getElementById("grid").style.webkitAnimation = "spin_3d 36s infinit e linear"; 116 document.getElementById("grid").style.animation = "spin_3d 36s infinite line ar";
117 }; 117 };
118 118
119 </script> 119 </script>
120 </head> 120 </head>
121 <body onload="loadBlocks()"> 121 <body onload="loadBlocks()">
122 <center> 122 <center>
123 <div id="lq"> 123 <div id="lq">
124 <div style="top: 252px; left: 203px; width: 196px; height: 196px; positi on: relative; 124 <div style="top: 252px; left: 203px; width: 196px; height: 196px; positi on: relative;
125 z-index: 0; text-align: left; border: 0px solid #999; padding: 0px; background: #333; 125 z-index: 0; text-align: left; border: 0px solid #999; padding: 0px; background: #333;
126 -moz-border-radius: 0px; -webkit-border-radius: 0px; text-align: cen ter;"> 126 -moz-border-radius: 0px; -webkit-border-radius: 0px; text-align: cen ter;">
127 $1 a pixel 127 $1 a pixel
128 </div> 128 </div>
129 </div> 129 </div>
130 <div class="ie" id="ie"> 130 <div class="ie" id="ie">
131 <div class="grid" id="grid"> 131 <div class="grid" id="grid">
132 <div class="row" id="row0"></div><div class="row" id="row1"></div><d iv class="row" id="row2"></div><div class="row" id="row3"></div><div class="row" id="row4"></div><div class="row" id="row5"></div><div class="row" id="row6"></d iv><div class="row" id="row7"></div><div class="row" id="row8"></div><div class= "row" id="row9"></div> 132 <div class="row" id="row0"></div><div class="row" id="row1"></div><d iv class="row" id="row2"></div><div class="row" id="row3"></div><div class="row" id="row4"></div><div class="row" id="row5"></div><div class="row" id="row6"></d iv><div class="row" id="row7"></div><div class="row" id="row8"></div><div class= "row" id="row9"></div>
133 </div> 133 </div>
134 </div> 134 </div>
135 </center> 135 </center>
136 </body> 136 </body>
137 </html> 137 </html>
OLDNEW
« no previous file with comments | « third_party/WebKit/ManualTests/transitions.html ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698