Авторский знак. Авторский знак. Seosait21.ru Есть у человека надежда. Пока не поздно. Вгрызайся и изучай.

октябрь 2020
Пн Вт Ср Чт Пт Сб Вс
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31


Чувашия-это моя Россия

Ссылки на каскадные стили CSS - animation-play-state.

Поддержка Браузеров

Internet Explorer Интернет эксплорер Google Chrome Google Chrome Opera Опера Firefox Firefox Safari Сафари, то есть тег поддерживается во всех основных браузерах.

Safari и Chrome поддерживают альтернативу animation-play-state.

Внимание!!! Свойство animation-play-state( анимация-игра-состояние) не поддерживается в Internet Explorer 9 и более ранних версий.

Определение и использование. Свойство animation-play-state определяет будет ли анимация работать или приостановлена. Внимание!!! Свойство animation-play-state используется в JavaScript для приостановки анимацию в середине цикла.

Самое мощное здесь даже не в том, что производится некое оживление некого участка страницы сайта. Самое мощное здесь в том, что функция animation-play-state, которая действует через стили CSS3 самостоятельно работает даже при отключения JavaScripta в браузере Вашего компьютера, то есть Вам не надо заморачиваться: будет работать эта функция в том или ином случае на страницах посетителей?

Синтаксис:

                animation-play-state: paused|running|initial|inherit;

Определение и использование

Свойство animation-play-state указывает - анимация работает или приостановлена.

Внимание!!! это свойство используется в JavaScript, чтобы приостанавливать анимацию в середине цикла.

Описание и использование

Значение по умолчанию: running
наследует: нет
Версия: CSS3
JavaScript синтаксис: "объект".style.animationPlayState="приостановлена"

Свойства Значение

Значение Описание
paused Указывает, что анимация приостановлена
running Значение по умолчанию. Указывает начало выполнения анимации
initial Это свойство задает значение по умолчанию.
inherit Наследует это свойство от своего родительского элемента.

Пишем программу - Пауза анимации:

< !DOCTYPE html>
< html>
< head>
< style> 
div
{
width:100px;
height:100px;
background:red;
position:relative;
animation:mymove 2s;
animation-play-state:paused;

/* Safari и Chrome */
-webkit-animation:mymove 2s;
-webkit-animation-play-state:paused;
}

@keyframes mymove
{
from {left:0px;}
to {left:200px;}
}

@-webkit-keyframes mymove /* Safari and Chrome */
{
from {left:0px;}
to {left:200px;}
}
< /style>
< /head>
< body>

< p>< strong>Внимание!!! < /strong> анимация-play-состояние не
 поддерживается в Internet Explorer 9 и более ранних версий.< /p>

 < div>< /div>

< /body>
< /html>

Результат программы:

Внимание!!! анимация-play-состояние не поддерживается в Internet Explorer 9 и более ранних версий.



seosait21.ru
HTML

seosait21.ru
CSS

seosait21.ru
Web-диз.
HTML ссылка CSS ссылка ...

seosait21.ru
JavaScript

seosait21.ru
PHP

seosait21.ru
JQuery
JavaScript ссылка PHP ссылка JQuery ссылка

seosait21.ru
SEO.

seosait21.ru
MySQL

seosait21.ru
XML
... ... ...

обратно на главную     назад    дальше     вперед

ПОНРАВИЛОСЬ?
ПОДЕЛИСЬ с ДРУЗЬЯМИ: