Вопросы с тегом 'css-animations'

CSS-анимации позволяют анимировать переходы из одной конфигурации стиля CSS в другую. Модуль CSS описывает способ для авторов анимации значений свойств CSS с течением времени с использованием ключевых кадров. Поведение этих анимаций ключевого кадра можно контролировать, указывая их продолжительность, количество повторов и повторяющееся поведение.
4

Поддержание конечного состояния в конце анимации CSS3

Я запускаю анимацию для некоторых элементов, которые установлены в opacity: 0; в CSS. Класс анимации применяется onClick и, используя ключевые кадры, изменяет непрозрачность от 0 до 1 (между прочим). К сожалению, когда анимация окончена, элементы в...
20 окт. '12 в 17:58
10

Как сделать мигающий/мигающий текст с помощью CSS 3

В настоящее время у меня есть этот код: @-webkit-keyframes blinker { from { opacity: 1.0; } to { opacity: 0.0; } } .waitingForConnection { -webkit-animation-name: blinker; -webkit-animation-iteration-count: infinite; -webkit-animation-tim...
02 мая '13 в 17:39
9

css3 переход анимации при загрузке?

Можно ли использовать анимацию перехода CSS3 при загрузке страницы без использования Javascript? Это то, что я хочу, но при загрузке страницы: http://rilwis.googlecode.com/svn/trunk/demo/image-slider.html Что я нашел до сих пор задержка перех...
24 июл. '11 в 7:22
8

CSS3 Spin Animation

Я просмотрел довольно много демо и не знаю, почему я не могу заставить CSS3 работать. Я использую последнюю стабильную версию Chrome. Скрипка: http://jsfiddle.net/9Ryvs/1/ div { margin: 20px; width: 100px; height: 100px; background: #f00...
13 февр. '13 в 17:25
7

CSS: анимация против перехода

Итак, я понимаю, как выполнять как CSS3-переходы, так и анимации. Что непонятно, и я googled, когда использовать. Например, если я хочу сделать отскок мяча, ясно, что анимация - это путь. Я мог бы предоставить ключевые кадры, и браузер будет делать ...
14 дек. '13 в 17:28
8

Имитация ярлыка с анимацией CSS3

Я действительно хочу сделать часть текста мигающим стилем старой школы, не используя javascript или текстовое оформление. Нет переходов, только * мигать *, * мигать *, * мигать *! EDIT: это отличается от этого вопроса, потому что я прошу мигать б...
19 дек. '12 в 15:02
8

Остановка анимации CSS3 на последнем кадре

У меня есть анимация с четырьмя частями CSS3, играющая при нажатии - но последняя часть анимации предназначена для снятия с экрана. Однако он всегда возвращается в исходное состояние после его воспроизведения. Кто-нибудь знает, как я могу останови...
05 дек. '10 в 15:55
24

Размытый текст после использования CSS transform: scale(); в Chrome

Похоже, недавно появилось обновление для Google Chrome, которое вызывает размытый текст после выполнения transform: scale(). В частности, я делаю это: @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); } 50%...
03 февр. '13 в 21:26
5

Одновременное воспроизведение нескольких анимаций CSS

Как я могу использовать две анимации CSS, которые играют на разных скоростях? Изображение должно вращаться и расти одновременно. Вращение будет проходить каждые 2 секунды. Рост будет циклироваться каждые 4 секунды. Пример кода: .image { po...
18 нояб. '14 в 3:32
8

Есть ли способ анимации эллипсиса с анимацией CSS?

Я пытаюсь создать анимацию с эллипсисом и задаюсь вопросом, возможно ли это с помощью анимации CSS... Итак, это может быть как Loading... Loading.. Loading. Loading... Loading.. И в основном просто продолжайте так. Любые идеи? Изменить: например...
22 окт. '12 в 15:36
12

Реагирование - монтирование и размонтирование одного компонента

Что-то простое должно быть легко выполнено, но я вытягиваю свои волосы из-за того, насколько это сложно. Все, что я хочу сделать, - это анимировать монтаж и размонтирование компонента React, что он. Вот что я пробовал до сих пор и почему каждое реше...
15 окт. '16 в 21:10
2

Вращающийся глобус в CSS

Я создаю вращающийся эффект земли в CSS. Я создал глобус в CSS: body { background-color: #111; } #earth { width: 300px; height: 300px; background: url(http://www.noirextreme.com/digital/Earth-Color4096.jpg); border-radius: 50%;...
05 янв. '15 в 14:30
5

Проблема Webkit CSS Animation - сохранение конечного состояния анимации?

Учитывая следующую анимацию CSS3.... <style type="text/css" media="screen"> .drop_box { -webkit-animation-name: drop; -webkit-animation-duration: 2s; -webkit-animation-iteration-count: 1; } @-webkit-keyframes drop { from { -webk...
17 июл. '10 в 22:10
5

Свойство CSS Animation остается после анимации

Я пытаюсь получить свойство анимации CSS, чтобы оставаться после завершения, возможно ли это? Это то, что я пытаюсь достичь... Элемент должен быть скрыт, когда пользователь приземляется на страницу, через 3 секунды (или что-то еще), он должен исчез...
19 мар. '12 в 17:23
8

Задержка анимации CSS в повторении

Недавно я обнаружил, как "правильно" использовать анимацию CSS (ранее я отклонил их как неспособную создавать сложные последовательности, как вы могли бы в JavaScript). Итак, теперь я узнаю о них. Для этого эффекта я пытаюсь выполнить градиентную "в...
14 дек. '12 в 23:53