» »

Делаем вращение для картинки на CSS

Делаем вращение для картинки на CSS

Создана анимация на вращение картинки, что все делается на чистом CSS. Автор сделал не просто круговорот, а чтоб было в предмете. А это получается стиральная машинка, сам не понимаю, где может пригодиться такое приложение, но интернет сети не предсказуемые, что возможно как по тематике или кто то может переделает, и поставить на портал. А этим вращением, он безусловно внимание сразу привлекает.

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



Приступаем к установке:

Ставим там, где вы посчитали нужным видеть на сайте.

Код
<img src="http://zornet.ru/zorner_ru_1/Veb/photo.png" class="turntable" />


И остается стили, скачиваем их и размещаем в CSS.

Давайте рассмотрим параметры и за что отвечают они:

turntable – этот класс будет отвечать за основную анимацию.

360deg – здесь ставим, какой градус вы хотите видеть на повороте..

1s – одно из главных, это скорость вращение. Что обозначает одна секунда, да очень скоростной.

Источник: Yraa.ru
16.05.2017 Загрузок: 3 Просмотров: 548 Комментарий: (8)

Поделиться в социальных сетях

Материал разместил

Комментарий: 8
csafrones
csafrones 16.05.2017 19:281
0
Может кто объяснить для чего этот скрипт?
-SAM-
-SAM- 16.05.2017 19:452
+1
В общем, всё написано в материале, но лучше посмотреть демо (там никакой gif-ки нет, такой эффект достигается на одних лишь стилях).
Kosten
Kosten 16.05.2017 19:493
0
А разве, кто то говорил о формате GIF.
Kosten
Kosten 16.05.2017 19:514
0
-SAM-, и на следующие, не нужно ссылок на сторонние ресурсы, так как вы не в курсе, что возможно демку сам хотел сделать, думаю вам также не понравится, если приду на вашу площадку и начну на ссылки на право и налево ставить, типа посмотрите, какая демонстрация, это не дело.
-SAM-
-SAM- 16.05.2017 23:386
0
Kosten
Kosten 16.05.2017 20:055
0
Что за скрипт, все в описание написано подробно.
Kolinkor
Kolinkor 17.05.2017 16:147
0
Все это старое, и можно найти, что то по серьезнее.
Kosten
Kosten 18.05.2017 22:488
0
А нового сейчас под юкоз почти не чего нет. Сейчас на форумах веб мастеров можно стили найти - которые также на сайт подойдут.
avatar