Hiệu ứng xoay ảnh đẹp cho diễn đàn Xenforo

[PVS]

Để mỗi khi chi chuột vào hình ảnh có những hiệu ứng đẹp mình xin giới thiệu tới các bạn một hiệu ứng sau

Mở template bb_code_base.css tìm

.bbCodeImage{
max-width:100%
}

thêm vào dưới nó:

Hiệu ứng 1:

.bbCodeImage{
-moz-transition: all .5s ease-in-out;
-webkit-transition: all .5s ease-in-out;
}
.bbCodeImage:hover{
moz-transform: scale(1.2) rotate(0deg);
-webkit-transform: scale(1.2) rotate(0deg);
position: relative;}

Hiệu ứng 2:

.bbCodeImage{
-moz-transition: all .5s ease-in-out;
-webkit-transition: all .5s ease-in-out;
}
.bbCodeImage:hover{
moz-transform: scale(1.1) rotate(90deg);
-webkit-transform: scale(1.1) rotate(90deg);
position: relative;}

Hiệu ứng 3:

.bbCodeImage{
-moz-transition: all .5s ease-in-out;
-webkit-transition: all .5s ease-in-out;
}
.bbCodeImage:hover{
moz-transform: scale(1.1) rotate(180deg);
-webkit-transform: scale(1.1) rotate(180deg);
position: relative;}

Hiệu ứng 4:

.bbCodeImage{
-moz-transition: all .5s ease-in-out;
-webkit-transition: all .5s ease-in-out;
}
.bbCodeImage:hover{
moz-transform: scale(1.1) rotate(360deg);
-webkit-transform: scale(1.1) rotate(360deg);
position: relative;}

Chúc các bạn thành công.

Nguồn: Online​

 

[shynn]

Không có demo à anh

 

[PVS]

ừ, chưa test nơi )

 

[nguyen]

style mình không có thì sao