Вопросы по теме 'css-animations'
С помощью CSS3 можно ли создавать ключевые кадры, которые заставляют границу пульсировать?
У меня есть изображение с рамкой вокруг. Я хочу, чтобы граница появлялась и исчезала. Возможно ли это с ключевыми кадрами непрозрачности + webkit? Идеи?
Спасибо
22602 просмотров
schedule
04.10.2023
МЕНЬШЕ CSS Передать миксин в качестве параметра другому миксину
Есть ли способ передать объявление одного миксина или стиля другому миксину в качестве входного параметра?
Давайте рассмотрим пример с ключевыми кадрами анимации. Ниже показано, как мы определяем ключевые кадры в чистом CSS:
@-moz-keyframes...
12591 просмотров
schedule
28.04.2024
Как получить скорость загрузки ЦП веб-сайта с помощью JavaScript
Я знаю, что это звучит как нелепый вопрос, или, может быть, несколько лет назад так и было бы. Я хотел бы знать, когда мой веб-сайт использует ЦП пользователей, чтобы я мог отображать уведомление (в виде поля, меняющего цвет с красного на зеленый)....
152 просмотров
schedule
24.02.2024
Редкая ошибка IE10: CSS-анимация background-position не работает с несколькими фонами и процентами
Это очень специфическая ошибка, однако я бы хотел, чтобы кто-нибудь показал мне обходной путь! Ошибка в основном заключается в том, что IE10 не может выполнить CSS-анимацию background-position , когда эти два условия выполняются одновременно :...
1328 просмотров
schedule
07.11.2022
Как отладить функцию синхронизации анимации кубического Безье
Я пытаюсь написать Android-эквивалент функции синхронизации CSS-анимации кубического Безье, используя собственный TimeInterpolator. Моя цель — воссоздать анимированный эффект, предоставленный нашей командой дизайнеров на Android, и я довольно близко...
784 просмотров
schedule
17.10.2023
Синхронизация цветной анимации ключевых кадров 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 просмотров
schedule
12.03.2024
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 просмотров
schedule
02.02.2024
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
Как улучшить производительность этой 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 в IE11
Я столкнулся с проблемой анимации css3 только в IE11.
Вот ссылка с проблемой (пожалуйста, откройте в ie11)
$(document).ready(function() {
$(".spinnerTinyBar").show();
$("#toggle").click(function() {...
1559 просмотров
schedule
05.08.2022
Анимация 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
Начать незацикленный GIF с самого начала только с помощью CSS
Я хотел бы знать, можно ли запустить незацикленный GIF с самого начала с помощью анимации CSS? В моем примере у меня есть два GIF-файла. Первый считает 1,2,3 каждую секунду - второй GIF считает 4,5,6 каждую секунду.
Моя цель — показывать первый...
1578 просмотров
schedule
22.10.2023
css анимация вращения и перевода не работает вместе
Я пробую анимацию css с помощью @keyframes, однако свойства поворота и перевода css Transform не работают вместе.
Пожалуйста, сообщите, что здесь пошло не так. Спасибо!!
Вы можете проверить код на codepen: http://codepen.io/anon/pen/XdzwZB ....
5808 просмотров
schedule
09.07.2022
Чисто CSS3 анимированная скользящая надпись при наведении
Фон довольно простой, я хотел, чтобы небольшая надпись скользила вверх от нижней части элемента, когда пользователь наводит курсор мыши или нажимает на него. См. рис. 1.
Небольшое копание показало, что это невозможно сделать с помощью CSS,...
2466 просмотров
schedule
03.12.2023
