» »

Вид материалов видео с вращением


Вид материалов видео с вращением

Данная реализация вида материалов видео отлично дополнить вашу галерею видео, а точнее вид материалов видео.

При наведении курсора на материал - происходит вращение на 360 градусов по часовой материала видео, а после того как курсор убран происходит вращение уже против часовой.

Края изображения округлены для большей привлекательности.

Так выглядит в процессе вращения:



В вид материалов видео:

Код
<a href="$ENTRY_URL$"><div class="sidebox-bd clr"><!-- <bc> --><div class="morph pic">
  <div class="ve-screen" title="$TITLE$" style="background-image: url($SCREEN_URL$);filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='$SCREEN_URL$',sizingMethod='scale');width:$PRV_WIDTH$px;height:$PRV_HEIGHT$px;"></div>
  $TITLE$</a><br>Раздел: $CATEGORY_NAME$</div>


В таблицу стилей ксс вставить:

Код
/*MORPH*/
.morph {
  -webkit-transition: all 1.0s ease;
  -moz-transition: all 1.0s ease;
  -o-transition: all 1.0s ease;
  -ms-transition: all 1.0s ease;
  transition: all 1.0s ease;
}
   
.morph:hover {
  border-radius: 50%;
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  transform: rotate(360deg);
}


Или же заключить в
Код
<style> наш стиль </style>

на страницах архива видео и главной странице видео
22.04.2016 Просмотров: 420 Комментарий: (10)

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

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

Комментарий: 10
FeStemBer
FeStemBer 23.04.2016 02:161
0
Мне интересно, а для чего видео должно вращаться, мне вот охота посмотреть, а тут как вентилятор, или просто при наведение на его, такая фишка.
Tergran
Tergran 23.04.2016 02:222
0
Tventum, у каждого сайта свои премудрости, вот одно из них, видео будет крутиться, но не думаю что на 180 градусов, а так, немного колыхнет.
Alex_L_X
Alex_L_X 23.04.2016 02:243
0
360 градусов... Можно водить по материалам курсором молниеносно и своего рода головоломка)))
csretven
csretven 23.04.2016 02:314
0
На осле выхожу, и на нем не чего, видать не настроен под этот браузер, с него только новости читать и не более.
Kosten
Kosten 23.04.2016 02:485
0
Вот если бы не крутилось, то бы можно было в 3 ряда поставить. Здесь в одном посту о кошках говорили, я думал человек так шутит, а он серьезно.

Alex_L_X
Alex_L_X 23.04.2016 02:566
0
это не от этого косяк кстати, ряд пустой, на любом виде материалов у меня такой "прогон" хотя стоит в настройках в 3 колонки
Kosten
Kosten 23.04.2016 03:037
0
Alex_L_X, в 3 колонки будет смотреться нормально, а то такое место пустует, это не позволительно для сайта.
Kosten
Kosten 24.04.2016 00:4110
0
Но оно вообще крутятся, смотрел, в первые вообще такое вижу, чтоб плеер круги наматывал.)
Alex_L_X
Alex_L_X 23.04.2016 03:078
0
Немогу найти этот косяк блин, даже размеры выставляю 100*100 и все равно маленькие но в 2 колонки, хотя все четыре бы вместились. Где то че то куда то задает как то параллельно together because a Lady Ga Ga from the Mitkhun Khachr'a'bordi on the morning from the Skype, a sometimes Patrick Squeizy and Bolo Young production
Kosten
Kosten 23.04.2016 05:039
0
Alex_L_X, не чего не понял) Но думаю с начало эффекты убрать а потом уже и выставлять, хотя думаю вы это знаете.
avatar