| <!doctype html> | |
| <html> | |
| <head> | |
| <title>Chrome 18 opacity test</title> | |
| <style> | |
| .ninety-nine{ | |
| opacity: 0.99; | |
| } | |
| </style> | |
| <script> | |
| function toggleOpacity() { | |
| var pre = document.getElementById('label'); | |
| if (document.body.className == '') { | |
| document.body.className='ninety-nine'; | |
| pre.innerHTML = 'opacity: 0.99'; | |
| } else { | |
| document.body.className=''; | |
| pre.innerHTML = 'opacity: 1.0'; | |
| } | |
| window.setTimeout("toggleOpacity();", 1000); | |
| } | |
| onload = toggleOpacity; | |
| </script> | |
| </head> | |
| <body> | |
| <div style="overflow: hidden"> | |
| <div style="-webkit-perspective: 10px"> | |
| Quite a lot of text: Opacity can be thought of as a postprocessing | |
| operation. Conceptually, after the element (including its descendants) | |
| is rendered into an RGBA offscreen image, the opacity setting specifies | |
| how to blend the offscreen rendering into the current composite rendering. | |
| The uniform opacity setting to be applied across an entire object. Any | |
| values outside the range 0.0 (fully transparent) to 1.0 (fully opaque) | |
| will be clamped to this range. If the object is a container element, then | |
| the effect is as if the contents of the container element were blended | |
| against the current background using a mask where the value of each pixel | |
| of the mask is the opacity value | |
| </div> | |
| <pre id="label"></pre> | |
| </div> | |
| </body> | |
| </html> |