Przed najechaniem:
#PageList1 a {
background:#fff;
display:block;
text-transform:uppercase;
text-align:center;
font-family: Calibri;
font-size:9px;
color:#000;
padding:1px;
margin-top:-6px;
letter-spacing:2px;
transition:all 1s;}
Po najechaniu:
#PageList1 a:hover {
border-radius:50px;background:#453622;
border-left:solid 4px #fff;
border-right:solid 4px #fff;
transition:all 1s;-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;}
Kolory wzięłam wprost z bloga próbnego, ale to nic, gdyż można je zmieniać, jak i inne wartości.
A teraz legenda:
Pomarańczowy - selektor, ja użyłam kodu na strony, lecz Ty możesz np. Na etykiety.
Zielony - to są kolory, można je dobrowolnie zmieniać według uznania.
Różowy - transformacje, możesz zmienić liczbę "1" na dowolną liczbę, ale polecam cyfry 1,2.
Błękitny - border radius oznacza zaokrąglenie, również możesz zmienić liczbę na własną.
Tekst nieoznaczony żadnym kolorem polecam pozostawić takim, jakim jest.
Mam nadzieję, że się podoba ten oto prosty kodzik. No bo co mówić, jak trudny nie jest. ;)
Czy dałoby się zrobić tak, że na przykład w tym menu strona 5 byłaby rozwijana i pokazywałyby się pod nią jakieś podstrony po najechaniu?
OdpowiedzUsuńDałoby się, jednak tego nie da się zrobić w gadżecie stron, tylko trzeba zrobić menu w HTML i ogólnie jest to trochę bardziej skomplikowane.
UsuńAlbo ogólnie tak, żeby te wszystkie strony się rozwijały po najechaniu na 'strona główna'
OdpowiedzUsuńMożesz ewentualnie spróbować ustawić małą wysokość całego gadżetu stron i ustawić, żeby po najechaniu się rozwijał.
Usuń