Rotirea avatarului la hover
Graphic Vision™

Nu sunteti conectat. Conectati-va sau inregistrati-va

Vezi subiectul anterior Vezi subiectul urmator In jos  Mesaj [Pagina 1 din 1]

1 Rotirea avatarului la hover la data de Sam Iun 23, 2012 11:19 am

avatar

Mitză
Administrator
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.

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);
}

Tutorial realizat de Wyn

2 Re: Rotirea avatarului la hover la data de Joi Iul 19, 2012 2:28 am

avatar

Gabytzu
Membru
Foarte bun tutorial bravo !

Vezi subiectul anterior Vezi subiectul urmator Sus  Mesaj [Pagina 1 din 1]

Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum