Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 23.11.2016, 03:39   #1
mrcojuhari
 
Регистрация: 09.08.2016
Сообщений: 7
По умолчанию Помогите найта ошибку в анимации

Уважаемы разработчики помогите понять где ошибка. Не работает анимация.

HTML
<div class="test">may animation</div>

CSS
@keyframes my{
from {left: 0;}
to {left: 300px;}
}
.test{
width: 200px;
height: 200px;
border: 1px solid red;
background: violet;

animation-name: my;
animation-duration: 10s;
animation-timing-function: ease-in-out;
animation-delay: 0s;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-play-state: running;
}
mrcojuhari вне форума Ответить с цитированием
Старый 23.11.2016, 05:44   #2
pompiduskus
юзер как все
Участник клуба
 
Аватар для pompiduskus
 
Регистрация: 10.01.2012
Сообщений: 1,586
По умолчанию

Код:
<!DOCTYPE html>
<html lang="en-US">
<head>

    <title>Page-Title</title>
    <meta charset="utf-8"/>

    <style type="text/css">
        @keyframes _anim{
            from {
                margin-left: 0;
                background-color: red;
            }

            to {
                margin-left: 300px;
                background-color: yellow;
            }

        }

        .test {
            width: 200px;
            height: 200px;
            border: 1px solid red;
            background: #F00;
            animation-name: _anim;
            animation-duration: 4s;
            animation-timing-function: ease-in-out;
            animation-delay: 0s;
            animation-iteration-count: infinite;
            animation-direction: alternate;
            animation-play-state: running;
        } 

    </style>

</head>
<body>
<!-- ========================================================== -->

    <div class="test">may animation</div>

<!-- ========================================================== -->
</body>
</html>
<Дзен - Вся вселенная в тебе > | Резюме: https://ch3ll0v3k.github.io/CV/
pompiduskus вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Помогите найти программу для создания flash роликов, Flash анимации Илья Квашнин Общие вопросы Web 2 29.01.2016 22:55
Помогите найта рабочий dede maximqq Общие вопросы Delphi 2 06.01.2014 19:57
Помогите найти ошибку - StrToFloat выдаёт ошибку EConvertError для ячеек StringGrid (Delphi) Artsiom Помощь студентам 10 18.12.2013 14:10
Анимации Shadow_1329 Gamedev - cоздание игр: Unity, OpenGL, DirectX 15 05.06.2009 21:47
Анимации Sanek777 Общие вопросы Delphi 0 02.11.2008 17:19