| OLD | NEW |
| (Empty) |
| 1 <html> | |
| 2 <head> | |
| 3 <title>Composited Scrollbars: different track part colours.</title> | |
| 4 <style> | |
| 5 ::-webkit-scrollbar { | |
| 6 width: 15px; | |
| 7 height: 15px; | |
| 8 } | |
| 9 ::-webkit-scrollbar-button:vertical:start { | |
| 10 background-color: red; | |
| 11 border: 1px dashed blue; | |
| 12 } | |
| 13 ::-webkit-scrollbar-button:vertical:end { | |
| 14 background-color: blue; | |
| 15 border: 1px dashed red; | |
| 16 } | |
| 17 ::-webkit-scrollbar-track-piece:start { | |
| 18 background-color: purple; | |
| 19 } | |
| 20 ::-webkit-scrollbar-track-piece:end { | |
| 21 background-color: green; | |
| 22 } | |
| 23 ::-webkit-scrollbar-button:start:decrement, | |
| 24 ::-webkit-scrollbar-button:end:increment { | |
| 25 display: block; | |
| 26 } | |
| 27 ::-webkit-scrollbar-thumb { | |
| 28 height: 20px; | |
| 29 background-color: yellow; | |
| 30 } | |
| 31 ::-webkit-scrollbar-button:horizontal:start { | |
| 32 background-color: cyan; | |
| 33 border: 1px dashed brown; | |
| 34 } | |
| 35 ::-webkit-scrollbar-button:horizontal:end { | |
| 36 background-color: brown; | |
| 37 border: 1px dashed cyan; | |
| 38 } | |
| 39 </style> | |
| 40 <script> | |
| 41 if (window.internals) { | |
| 42 window.internals.settings.setMockScrollbarsEnabled(false); | |
| 43 } | |
| 44 if (window.testRunner) { | |
| 45 window.testRunner.waitUntilDone(); | |
| 46 window.testRunner.dumpAsText(true); // This is only useful as a pixel test. | |
| 47 } | |
| 48 | |
| 49 function doTest() | |
| 50 { | |
| 51 window.scrollTo(400,300); | |
| 52 window.setTimeout(function() { | |
| 53 if (window.testRunner) { | |
| 54 window.testRunner.notifyDone(); | |
| 55 } | |
| 56 }, 0); | |
| 57 } | |
| 58 | |
| 59 window.addEventListener("load", doTest, false); | |
| 60 </script> | |
| 61 </head> | |
| 62 <body> | |
| 63 <div style="width: 1600px; height: 1000px; -webkit-transform: translateZ(0);"> | |
| 64 </div> | |
| 65 <div style="position : absolute; left : 450; top : 350; width : 200px; height :
100px; border-style : solid; border-color : green; border-width : 2px"> | |
| 66 <!--- | |
| 67 <h2>Composited Custom Scrollbars with Different Coloured Track Parts</h2> | |
| 68 If this test succeeds, the track part before the thumb will be purple, and the t
rack part after | |
| 69 the thumb will be green. All four button rects will have different colours. | |
| 70 | |
| 71 The div border should be in the top-left area of the window. | |
| 72 ---> | |
| 73 </div> | |
| 74 </body> | |
| 75 </html> | |
| OLD | NEW |