2009-08-14 4 views
1

я могу использовать следовать код CSS, чтобы сделать некоторые простые анимации, но я хочу сделать более продвинутый:Как сделать анимацию с помощью CSS и WebKit

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

Я хочу DIV с непрозрачностью: 0 непрозрачности 1. Кроме того, я хочу, чтобы позиция переход от х, у й, у + 10 Наконец, я хочу ДИВ стать невидимыми, поэтому, я хочу вниз непрозрачность 1 до 0.

Как я могу это сделать? Или невозможно сделать эту сложную анимацию в CSS?

ответ

2

Apple Developer Website

Webkit.org

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

div:hover { 
    opacity: 0; 
} 

Это, конечно, возможно, но я не знаю, в каком контексте вы хотите. Я использую его для зависания ссылок и т. Д., Они работают очень хорошо.

И наконечник (этот пример вращения):

-moz-преобразование: поворот (180 градусов); transform: вращать (180deg); фильтр: progid: DXImageTransform.Microsoft.BasicImage (вращение = 2);

Вы можете делать эти трюки во многих браузерах, а не только в Safari.

http://www.zachstronaut.com/

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

Много ссылок, надеюсь, что они помогут и удачи!

Смежные вопросы