Szukam Zmiana kształtu awatara po najechaniu na niego myszką

wersja skryptu MyBB: 1.6.16
adres forum: --
na czym polega problem (screen, opis, komunikaty): Wie ktoś jak zrobić takie coś, że mamy kwadratowy avatar a gdy na niego najedziemy robi sie okrągly? Proszę o odpowiedzi. Pozdrawiam.

Matslom napisał 26.02.2015, 21:33:
Tytułuj wątki poprawnie

"border radius", w "hover"

Jeżeli można to prosił bym o gotowy kod.

.klasaawatar:hover {
border-radius: 50%;
}

Wystarczy to podpiąć pod klasę z awatarami.

Nie widze nigdzie klasy z avatarem.

Podaj adres forum, bez tego nic nie wymyślimy.

Problem rozwiazany , prosze o usuniecie tego posta poniewaz nie chce podawac adresu forum

Do arkusza CSS:

.avatar_postbit:hover {border-radius: 50%;} 


W szablonie postbit_avatar dopisz po <img -

class="avatar_postbit"

Mam nadzieję, że chodzi o posty.

Działa lecz chciałbym żeby jeszcze było to płynne po najechaniu. Bo gdy najade to zmienia sie na okragly tak "nagle". I zeby jeszcze zaokraglal sie w profilu.

http://css3.bradshawenterprises.com/transitions/

W takim razie dodaj jeszcze:

.avatar_postbit {
  -webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
} 


Okej zaokragla ladnie teraz. Tylko co z tym w profilu?

w showthread.css masz:

.useravatar img{
    padding: 2px;
    background: white;
    border: 1px solid #000;    
    box-shadow: 0px 1px 2px #000;
}
.useravatar img:HOVER{border: 1px solid #000;} 


zamień to na:

.useravatar img{
    padding: 2px;
    background: white;    
    -webkit-transition: all 1s ease-in-out;
     -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    border: 1px solid #000;    
    box-shadow: 0px 1px 2px #000;
}

.useravatar:hover img{
    border: 1px solid #000;
    border-radius: 50%;
} 


Działa dzieki!