Posbit Avatar Hover (Turns 360+ Effect)

Суть: при наведении курсора на автор, автор крутится/переворачивается на 300° или другой вариант - аватор с эффектом зума.

vB Version: 4.2.0
Mod Version:1.00,
Coder/Designer: ChiNa-Man

1. Идем в Стили и Шаблоны/Выбираем редактируемый стиль/Ищем шаблон additional.css/добавляем ниже:

PHP код:

---

.myavatar:hover {  
 transition: all 3s ease;  
-webkit-transition: all 3s ease;  
-moz-transition: all 3s ease; transform:rotate(360deg);  
-moz-transform:rotate(360deg);  
-webkit-transform:rotate(360deg); position:relative; 
} 


---

2. Идем в Стили и Шаблоны/Выбираем редактируемый стиль/Ищем шаблон postbit_legacy/ в нем ищем:

PHP код:

---

 <img src="{vb:raw post.avatarurl}" alt="{vb:rawphrase xs_avatar, {vb:raw post.username}}" title="{vb:rawphrase xs_avatar, {vb:raw post.username}}" /> 


---

И заменяем на:

PHP код:

---

<div class="myavatar"><img src="{vb:raw post.avatarurl}" alt="{vb:rawphrase xs_avatar, {vb:raw post.username}}" title="{vb:rawphrase xs_avatar, {vb:raw post.username}}" /></div> 


---

------
Если желаем установить эффект увеличения автора, возвращаемся в additional.css/заменяем недавно добавленный код на:

PHP код:

---

.myavatar:hover {  
opacity: 1; filter: alpha(opacity=100); 
transition: all 2s ease;  
-webkit-transition: all 2s ease;  
-moz-transition: all 2s ease; 
transform:rotate(0deg);  
-moz-transform:rotate(0deg);  
-webkit-transform:rotate(0deg); 
transform: scale(1.5);  
-webkit-transform: scale(1.5);  
-moz-transform: scale(1.5); 
position:relative; 
} 


---