Building Web Apps for Google TV by Andres Ferrate & Amanda Surya & Daniels Lee & Maile Ohye & Paul Carff & Shawn Shen & Steven Hines

Building Web Apps for Google TV by Andres Ferrate & Amanda Surya & Daniels Lee & Maile Ohye & Paul Carff & Shawn Shen & Steven Hines

Author:Andres Ferrate & Amanda Surya & Daniels Lee & Maile Ohye & Paul Carff & Shawn Shen & Steven Hines [Andres Ferrate]
Language: eng
Format: epub
Tags: COMPUTERS / Internet / General
ISBN: 9781449304560
Publisher: O'Reilly Media
Published: 2011-06-15T16:00:00+00:00


-webkit-transition

When this style is applied to an element, it signifies that style changes applied subsequently will transition from the initial state to the new state over time. This can be accomplished without any JavaScript code.

For example, the following page shows a green box that changes to a larger, red box when hovered over with the mouse:

<html> <head> <style> body { overflow: hidden; } .wkt-demo { -webkit-transition-property: background-color, width, height; -webkit-transition-duration: 1s, 2s, 4s; -webkit-transition-timing-function: ease-in-out; -webkit-transition-delay: .25s; } .test-div { width: 50px; height: 50px; background-color: #0e0; } .test-div:hover { width: 300px; height: 300px; background-color: #e00; } </style> </head> <body> <div> <p> The DIV below will change background color, top and left positions using a CSS3 transition when hovered over, but each will change at a different rate. </p> <div class="test-div wkt-demo"></div> </div> </body> </html>



Download



Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.