css-animations

В приведенном ниже примере вы можете увидеть, как коробки немного прыгают, как я могу сделать этот переход плавным? .container { text-align: center; margin-top: 30px; } .box { background: rgba(0, 10, 103, 0.5); height: 50px; width: 50px; border: 3px solid rgba(0, 10, 103, 0.9); ...

Я пытаюсь оживить элемент, вращающийся, как кто-то запускает волчок. Сначала элемент будет вращаться против часовой стрелки, прежде чем перейти к бесконечному вращению по часовой стрелке. Общий CSS у меня здесь: div { animation: PreRotate 800ms ease-out 0ms 1, Rotate 500ms linear infini...

Я пытаюсь заставить эту панель навигации работать без этого "нервного" эффекта в Safari. Он хорошо работает во всех других браузерах. Проблема в том, что при наведении курсора на звенья планка прыгает вниз. Вы можете проверить код здесь http://jsfiddle.net/kpady8hr/14/ <nav class="top-menu"> <div ...

Я пытаюсь сделать простую анимацию с использованием ключевых кадров, но она работает только в Chrome. Вот код (я включил код ключевых кадров только один раз, для более короткого сообщения): @keyframes logokf { 0% { background-image: url('gfx/logo1.png'); } 20% { background-image: url...

я запускаю анимацию на некоторых элементах, которые установлены в opacity: 0; в CSS. Класс анимации применяется onClick, и, используя ключевые кадры, он изменяет непрозрачность от 0 до 1 (между прочим). к сожалению, когда анимация заканчивается, элементы возвращаются к opacity: 0 (как в Firefox, так и в Chro...

Я действительно хочу, чтобы кусок текста мигал в стиле старой школы без использования javascript или текстового оформления. никаких переходов, только * мигать*, * мигать*,*мигать*! EDIT: это отличается от этого вопроса, потому что я прошу мигание без непрерывных переходов, тогда как OP других вопросов сп...

Я пытаюсь анимировать многоточие, и мне было интересно, возможно ли это с анимацией CSS... Так что это может быть как Loading... Loading.. Loading. Loading... Loading.. и просто продолжать. Есть идеи? редактировать: вот так:http://playground.magicrising.de/demo/ellipsis.html...

Я пытаюсь получить стереть анимацию, чтобы сделать круг похожим он наполняется водой. Я столкнулся с двумя ошибками, и даже не смог справиться с третьей: он заполняет неправильный путь он сбрасывается на пустой (черный) после того, как он заполнил* сейчас я использую <img> теги, но я хотел бы перенес...

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

Как я могу иметь две анимации CSS играть на разных скоростях? изображение должно вращаться и расти одновременно. вращение будет циклически каждые 2 секунды. рост будет циклически каждые 4 секунды. Пример Кода: .image { position: absolute; top: 50%; left: 50%; width: 120px; height: 1...