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

Discussion in 'Tips and Guides' started by PVS, May 27, 2015.

  1. PVS

    PVS Cộng Sự Đặc Biệt Staff Member

    Joined:
    Feb 28, 2015
    Messages:
    11,779
    Likes Received:
    7,039
    Trophy Points:
    113
    Gender:
    Male
    Location:
    Huế
    Home Page:
    Để 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
    Code:
    .bbCodeImage{
    max-width:100%
    }
    thêm vào dưới nó:

    Hiệu ứng 1:
    Code:
    .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:
    Code:
    .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:
    Code:
    .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:
    Code:
    .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​
     
  2. shynn

    shynn Thượng Đế

    Joined:
    Mar 18, 2015
    Messages:
    207
    Likes Received:
    171
    Trophy Points:
    43
    Gender:
    Male
    Occupation:
    Học Sinh
    Location:
    Nghệ An
    Không có demo à anh
     
  3. PVS

    PVS Cộng Sự Đặc Biệt Staff Member

    Joined:
    Feb 28, 2015
    Messages:
    11,779
    Likes Received:
    7,039
    Trophy Points:
    113
    Gender:
    Male
    Location:
    Huế
    Home Page:
    ừ, chưa test nơi :))
     
  4. nguyen

    nguyen Thượng Đế

    Joined:
    Apr 2, 2015
    Messages:
    7
    Likes Received:
    6
    Trophy Points:
    3
    Gender:
    Male
    style mình không có thì sao
     

Share This Page