|
Ładny efekt menu. |
| Autor |
Wiadomość |
xenty
Pomógł: 1 raz
Posty: 100
|
 Wysłany: 06-04-2009, 17:12 Ładny efekt menu.
|
|
|
Witam.
Chciałbym zrobić efekt menu taki jak na http://owsian.net/ (prawie taki).
Chcę mieć na początku obrazek, jednak po najechaniu myszy żeby zmienił się na inny, większy, co da efekt "wyjścia" czy tez obniżenia się danego przycisku.
Podobny efekt jest na http://www.kurshtml.boo.p..._menu,menu.html ( chodzi mi o to niebieskie menu), jednak ja chcę to zrobić z obrazkiem.
Wiem, że tam to jest opisane, jednak nie wiem ocb 
Może ktoś wytłumaczyć jak to zrobić chociaż na jakimś przykładzie.
Z góry thx  |
|
 |
|
 |
Gadatliwa Kasia 
|
|
|
|
|
wolfiq
Pomógł: 56 razy
Posty: 176
|
| Wysłany: 06-04-2009, 17:31
|
|
|
| Cytat: | | Efekt wysuwania po wskazaniu myszką został uzyskany poprzez zwiększenie wysokości górnego obramowania linków. Określenie pozycji absolutnej eliminuje przesuwanie się elementów, które znajdują się poniżej menu, gdy podświetlamy linki. Jest to potrzebne tylko z uwagi na błąd Internet Explorera. |
przecież napisane tam jest |
_________________
pisz do mnie PW lub e-maila, jak Ci pozwolę, inaczej nie odpiszę |
|
 |
|
|
xenty
Pomógł: 1 raz
Posty: 100
|
|
|
|
|
|
wolfiq
Pomógł: 56 razy
Posty: 176
|
| Wysłany: 06-04-2009, 18:22
|
|
|
hmm... prosze
| Kod: | <html>
<head>
<style type="text/css">
/* <![CDATA[ */
#CONTENT ul.menu_poziome_b, #CONTENT ul.menu_poziome_b li {
display: block;
list-style: none;
margin: 0;
padding: 0;
line-height: normal;
font-size: 12px;
}
#CONTENT ul.menu_poziome_b li {
float: left;
}
#CONTENT ul.menu_poziome_b a:link, #CONTENT ul.menu_poziome_b a:visited {
text-decoration: underline;
}
#CONTENT ul.menu_poziome_b a:link, #CONTENT ul.menu_poziome_b a:visited, #CONTENT ul.menu_poziome_b a:hover {
border: none;
}
#CONTENT ul#menu_poziome2 {
position: absolute;
}
#CONTENT ul#menu_poziome2 li {
border-width: 0 1px 1px 1px;
border-style: solid;
border-color: transparent #25b #25b #9ce;
}
#CONTENT ul#menu_poziome2 a:link, #CONTENT ul#menu_poziome2 a:visited {
text-decoration: none;
display: block;
width: 95px;
text-align: center;
padding: 5px 0;
font-weight: bold;
background-color: #27c;
color: #def;
border-top: 10px solid #25b;
}
#CONTENT ul#menu_poziome2 a:hover {
background-color: #28e;
color: #fff;
border-top: 20px solid #26d;
}
/* ]]> */
</style>
</head>
<body>
<div id="CONTENT">
<div class="CONTENT">
<ul class="menu_poziome_b" id="menu_poziome2">
<li><a href=" ">Link 1</a></li>
<li><a href=" ">Link 2</a></li>
<li><a href=" ">Link 3</a></li>
<li><a href=" ">Link 4</a></li>
<li><a href=" ">Link 5</a></li>
</div></div>
</ul>
</body>
</html> |
|
_________________
pisz do mnie PW lub e-maila, jak Ci pozwolę, inaczej nie odpiszę |
|
|
|
|
|
xenty
Pomógł: 1 raz
Posty: 100
|
| Wysłany: 06-04-2009, 21:46
|
|
|
dzięki 
Już sobie jakoś poradzę.
A mógłbyś mi jeszcze powiedzieć co oznacza #CONTENT ? |
|
|
|
|
|
wolfiq
Pomógł: 56 razy
Posty: 176
|
|
|
|
|
|
xenty
Pomógł: 1 raz
Posty: 100
|
| Wysłany: 07-04-2009, 16:43
|
|
|
Jakoś skleiłem to menu 
Ale mam problem z efektem podmiany.
Gdy najade myszką na przycisk Kontakt ( w dowolnym miejscu na tym przycisku) to obrazek się zmienia. Jednak w innych przyciskach musze najeżdżać na lewą stronę obrazka by nastąpiła podmiana. Z resztą sami zobaczcie: http://myfootball.pl/stronka/index.html
Co z tym zrobić?
Co zrobiłem źle? |
|
|
|
|
|
wolfiq
Pomógł: 56 razy
Posty: 176
|
| Wysłany: 07-04-2009, 19:45
|
|
|
czemu tego tak nie zrobiłeś ??
| Kod: | <ul class="start2" id="start1"><li><a href=" "></a></li></ul>
<ul class="omnie2" id="omnie1"><li><a href=" "></a></li></ul>
<ul class="galeria2" id="galeria1"><li><a href=" "></a></li></ul>
<ul class="projekty2" id="projekty1"><li><a href=" "></a></li></ul>
<ul class="wwolnymczasie2" id="wwolnymczasie1"><li><a href=" "></a></li></ul>
<ul class="kontakt2" id="kontakt1"><li><a href=" "></a></li></ul> |
znacznik <ul> otwiera listę, więc powinno być jej zamknięcie </ul>
tak samo jak i inne znaczniki do list owieranie i zamykanie.
Czemu do każdego menu masz inne class ? hmm... może napsiz co chcesz zrobić będzie prościej |
_________________
pisz do mnie PW lub e-maila, jak Ci pozwolę, inaczej nie odpiszę |
|
|
|
|
|
xenty
Pomógł: 1 raz
Posty: 100
|
| Wysłany: 07-04-2009, 20:06
|
|
|
Chcę zrobić wysuwane menu.
Tylko że z obrazkami a nie z kolorkiem w tle i tekstem.
A że każdy obrazek mam inny wiec każdy osobno chciałem opisać.
Nie wiem, może jakoś inaczej to można zrobić ale nie znam się wiec zacząłem kombinować |
|
|
|
|
|
pawelooss
Pomógł: 4 razy
Posty: 110
|
| Wysłany: 07-04-2009, 20:08
|
|
|
| Dzięki za podsunięcie tematu. Ja pobawiłem się skryptem jQuery i śmiga jak miło, a w dodatku efekt jest płynny, a nie skokowy. Z resztą możesz podejrzeć w topie mojego forum, jak to działa (źródło strony i te sprawy). Pozdrawiam! |
_________________
Nie widzę przez ściany i nie umiem pleść wiklinowych koszyków. ^^, |
|
|
|
|
|
wolfiq
Pomógł: 56 razy
Posty: 176
|
| Wysłany: 07-04-2009, 20:12
|
|
|
| xenty, to zrób sobie w tabelkach i jako onmouseover |
_________________
pisz do mnie PW lub e-maila, jak Ci pozwolę, inaczej nie odpiszę |
|
|
|
|
|
xenty
Pomógł: 1 raz
Posty: 100
|
| Wysłany: 07-04-2009, 20:16
|
|
|
| WhiteWolf napisał/a: | | to zrób sobie w tabelkach i jako onmouseover |
onmouseover ? to dopiero zamuła
Powiecie mi jak ułożyć poszczególne przyciski menu obok siebie, oraz żeby między nimi był odstęp 15px?
| pawelooss napisał/a: | | Ja pobawiłem się skryptem jQuery |
No moze kiedys
Na razie muszę się tego nauczyć, nie chce już sobie mieszać 
Z resztą ja robię stronkę na infę i jakbym musiał nauczycielowi tłumaczyć jak to zrobiłem, że takie coś w ogóle istnieje to by mi lekcji nie starczyło ^^ |
|
|
|
|
|
pawelooss
Pomógł: 4 razy
Posty: 110
|
| Wysłany: 07-04-2009, 20:29
|
|
|
| xenty napisał/a: | | żeby między nimi był odstęp 15px |
| Kod: | ul#menu li {
padding-right: 15px;
} |
Może tak? |
_________________
Nie widzę przez ściany i nie umiem pleść wiklinowych koszyków. ^^, |
|
|
|
|
|
xenty
Pomógł: 1 raz
Posty: 100
|
| Wysłany: 07-04-2009, 20:40
|
|
|
E e
To nie to.
Jak używam np. to coś tam się przesuwa, ale nie tak jak trzeba.
Jak ustawić te przyciski obok siebie? Bo jak nie dam margin to one są na sobie |
|
|
|
|
|
Gadatliwa Kasia
|
|
|
|
|
pawelooss
Pomógł: 4 razy
Posty: 110
|
| Wysłany: 07-04-2009, 20:42
|
|
|
| Wrzuć kod strony, CSS-y, obrazki itp. jako załącznik, to ściągnę i coś pokombinuję. |
_________________
Nie widzę przez ściany i nie umiem pleść wiklinowych koszyków. ^^, |
|
|
|
|
|
|
|
FAQ - PIERWSZA POMOC!!
REGULAMIN
SZUKAJ
Użytkownicy
Grupy
Statystyki
Rejestracja
Zaloguj
Download
Katalog Forów
