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

С помощью CSS3 можно ли создавать ключевые кадры, которые заставляют границу пульсировать?
У меня есть изображение с рамкой вокруг. Я хочу, чтобы граница появлялась и исчезала. Возможно ли это с ключевыми кадрами непрозрачности + webkit? Идеи? Спасибо
22602 просмотров
schedule 04.10.2023

МЕНЬШЕ CSS Передать миксин в качестве параметра другому миксину
Есть ли способ передать объявление одного миксина или стиля другому миксину в качестве входного параметра? Давайте рассмотрим пример с ключевыми кадрами анимации. Ниже показано, как мы определяем ключевые кадры в чистом CSS: @-moz-keyframes...
12591 просмотров
schedule 28.04.2024

Анимация CSS3 (анимация ключевого кадра)
Я хочу анимацию css3 с требованиями ниже, было бы здорово, если бы кто-нибудь поделился своим опытом у меня есть три изображения image1.jpg : будет анимация снизу вверх (image2.jpg и image3.jpg должны быть скрыты) image2.jpg : появится на...
483 просмотров
schedule 06.06.2024

Как получить скорость загрузки ЦП веб-сайта с помощью JavaScript
Я знаю, что это звучит как нелепый вопрос, или, может быть, несколько лет назад так и было бы. Я хотел бы знать, когда мой веб-сайт использует ЦП пользователей, чтобы я мог отображать уведомление (в виде поля, меняющего цвет с красного на зеленый)....
152 просмотров
schedule 24.02.2024

Редкая ошибка IE10: CSS-анимация background-position не работает с несколькими фонами и процентами
Это очень специфическая ошибка, однако я бы хотел, чтобы кто-нибудь показал мне обходной путь! Ошибка в основном заключается в том, что IE10 не может выполнить CSS-анимацию background-position , когда эти два условия выполняются одновременно :...
1328 просмотров

Как отладить функцию синхронизации анимации кубического Безье
Я пытаюсь написать Android-эквивалент функции синхронизации CSS-анимации кубического Безье, используя собственный TimeInterpolator. Моя цель — воссоздать анимированный эффект, предоставленный нашей командой дизайнеров на Android, и я довольно близко...
784 просмотров

Синхронизация цветной анимации ключевых кадров CSS
Предположим, у меня есть три элемента div неизвестной высоты, один из которых имеет анимированный фоновый цвет с использованием анимации ключевых кадров CSS (см. http://css-tricks.com/color-animate-any-shape-2 ) @-webkit-keyframes super-rainbow...
6934 просмотров
schedule 12.11.2023

Установите различную скорость перехода Css3 для div и его дочерних элементов
Я пытаюсь внедрить Slidejs на свой сайт. Вот ссылка на библиотеку . Что я хотел бы сделать, так это установить другой переход скорости в зависимости от элемента. Вот моя структура HTML: <div id="slides" class="sliders_1"> <div...
363 просмотров

CSS-анимация переворачивания карточек для браузеров WebKit предотвращает работу ссылок
Я пытаюсь понять, как создать анимацию переворота карты, которая срабатывает, когда вы щелкаете в любом месте на лицевой стороне карты, и переворачивается, когда мышь уходит. У меня работает базовая анимация, но проблема в том, что обе стороны...
1205 просмотров
schedule 31.10.2022

Изменить скорость анимации при наведении
Я строю планетную систему, где можно наводить курсор на орбиту и изменить скорость анимации . Я пробовал это с onMouseOver и .hover jquery, но не мог понять, почему это не работало. #universum-planet1 { position: absolute; height:...
4374 просмотров
schedule 28.02.2024

Загрузка Facebook SDK в IE11 прерывает анимацию CSS
После загрузки Facebook SDK мои анимации CSS ломаются в IE11. Вот тестовый пример: http://tremby.net/dump/ie11test.html Щелчок по кнопке переключает класс на ней, который немного поворачивает кнопку с помощью анимации CSS. Через пять секунд...
299 просмотров

CSS @keyframes не работает в Chrome
Я экспериментировал с анимацией CSS3 @keyframes, но мне не удалось заставить ее работать в Chrome (сейчас у меня Chrome 38) Код действительно прост: HTML <div id="block">moving text</div> CSS @keyframes mymove...
16940 просмотров
schedule 22.02.2024

плавный переход между зависанием и нормальным состоянием (с использованием анимации css3)
каждый раз, когда я использую ключевые кадры для анимации при наведении, анимация останавливается на листьях мыши и примерно возвращается в исходное состояние. Есть ли шанс сделать движение более плавным? Я пытался использовать переходы, но они,...
387 просмотров
schedule 11.04.2024

Ошибка переворота карты CSS (отступы? поля?)
Я пытаюсь создать интерактивный календарь. Я добавил изящную анимацию CSS Card Flip (руководство здесь) , чтобы переворачивать дату календаря и отображать больше информация на обратной стороне карты. Проблема, если вы наводите указатель мыши на...
732 просмотров
schedule 04.11.2022

невозможно установить источник преобразования в Firefox
Я пытаюсь создать анимацию с помощью SVG и CSS3. Она отлично работает в Chrome, но не работает в Firefox. Я пытался добавить префикс -moz- к transform-origin: , но пока это не работает. здесь я создал живой образец Правила Css, которые я...
45 просмотров
schedule 10.11.2023

Почему не отображается реальное время? Часы Jquery/CSS
Я создал небольшие анимированные часы с помощью CSS/Jquery, используя код, найденный здесь , и здесь . В настоящее время в файле clocks.js есть код из codepen с удаленными международными элементами. Но ни один из них не отображает текущее время....
657 просмотров
schedule 26.05.2024

Как улучшить производительность этой CSS-анимации?
Я использую Chrome и чистую pulse анимацию CSS. .pulse { width: 20px; height: 20px; vertical-align: middle; background-color: #53A653; border-radius: 100%; -webkit-animation: scaleout 3.0s infinite ease-in-out; animation:...
314 просмотров
schedule 15.11.2022

Как сделать плавные ключевые кадры анимации?
Я новичок в анимациях css3. У меня есть этот код, который анимирует ноги svg. Но проблема в том, что движение не плавное при смене ключевых кадров. От 0% блока кода до 33% блока кода возникает ощущение задержки. Такое ощущение, что он мгновенно...
108 просмотров
schedule 30.05.2024

Проблема с анимацией CSS3 в IE11
Я столкнулся с проблемой анимации css3 только в IE11. Вот ссылка с проблемой (пожалуйста, откройте в ie11) $(document).ready(function() { $(".spinnerTinyBar").show(); $("#toggle").click(function() {...
1559 просмотров

Анимация css-свойства в Polymer 1.0
В Polymer 0.5 вы можете анимировать свойство следующим образом: https://www.polymer-project.org/0.5/platform/web-animations.html Но как это сделать в 1.0? Я хотел бы анимировать непрозрачность одного из моих дочерних элементов в моем полимерном...
286 просмотров
schedule 26.03.2024