Navigare rapidă

Ultimele subiecte
» 10 King
Scris de Erpel Vin 29 Mar - 16:31
» Bulletin ipb theme
Scris de MihaiExtremTutorials Sam 15 Dec - 0:24
» Wireless ipb theme [punBB]
Scris de D1esel Vin 30 Noi - 21:51
» Ying-Yang Tutorial
Scris de Lucifer Mar 24 Apr - 11:34
» Avatar forumotion toolbar
Scris de Lucifer Mar 24 Apr - 11:33
Cuvinte-cheie

edit  

Rotirea avatarului la pozitionarea cursorului pe acesta


In acest tutorial am sa va prezint cum puteti face ca avatarul sa se roteasca la 360 de grade pentru toate versiunile. Este un tutorial simplu, dar care are un aspect frumos daca este aplicat de forumul tau.

Pentru forumurile forumgratuit:
Spoiler:
PhpBB2:
Cod:
.poster-profile img{
    -webkit-transition: all 1.0s ease-out;
    -moz-transition: all 1.0s ease;
    -o-transition: all 1.0s ease;
}
 
.poster-profile img:hover {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
}




PhpBB3:

Cod:
div.postprofile dl dt img{
    -webkit-transition: all 1.0s ease-out;
    -moz-transition: all 1.0s ease;
    -o-transition: all 1.0s ease;
}
 
div.postprofile dl dt img:hover {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
}




PunBB:

Cod:
div.user-basic-info img{
    -webkit-transition: all 1.0s ease-out;
    -moz-transition: all 1.0s ease;
    -o-transition: all 1.0s ease;
}
 
div.user-basic-info img:hover {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
}




Invision:

Cod:
dl.postdetails dt img{
    -webkit-transition: all 1.0s ease-out;
    -moz-transition: all 1.0s ease;
    -o-transition: all 1.0s ease;
}
 
dl.postdetails dt img:hover {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
}


Pentru forumurile care utilizeaza platforma PhpBB:

Spoiler:
Prosilver:
Cod:
dl.postprofile img{
    -webkit-transition: all 1.0s ease-out;
    -moz-transition: all 1.0s ease;
    -o-transition: all 1.0s ease;
}
 
dl.postprofile img:hover {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
}


Tutorial scris de Mitza

Copyright Extrem-Tutorials.com - Nici o parte a acestui tutorial nu poate fi reprodusa fara acordul autorului.

Comentariile utilizatorilor

Fii primul care comenteaza acest articol