2009-08-14 9 views
1

Je peux utiliser suivre le code CSS pour faire une animation simple, mais je veux faire plus avancée:Comment faire de l'animation de l'utilisation de CSS et webkit

opacity: 1; 
    -webkit-transition-property: opacity, linear; 
    -webkit-transition-duration: 2s, 4s; 

Je veux la div d'opacité: 0 à l'opacité 1. de plus, je veux la position est passer de x, y à x, y + 10 Enfin, je veux que le div deviennent invisibles, donc, je veux descendre l'opacité 1 à 0.

Comment puis-je faire cela? Ou il n'est pas possible de faire ces animations complexes dans CSS?

Répondre

2

Apple Developer Website

Webkit.org

div { 
    opacity: 1; 
    -webkit-transition: opacity 1s linear; 
} 

div:hover { 
    opacity: 0; 
} 

Il est certainement possible, mais je ne sais pas dans quel contexte vous voulez. Je l'utilise pour les survols sur les liens et autres, ils fonctionnent très bien.

Et je pointe (cette rotation exemple):

-moz-transform: rotate (180 °); transformer: tourner (180deg); filtre: progid: DXImageTransform.Microsoft.BasicImage (rotation = 2);

Vous pouvez faire ces trucs sur de nombreux navigateurs, pas seulement sur Safari.

http://www.zachstronaut.com/

http://snook.ca/archives/html_and_css/css-text-rotation/

Beaucoup de liens, l'espoir qu'ils aident et bonne chance!