Witam. W jaki sposób mogę zrobić submenu do tego: http://www.robertmendak.com/edyta2/ ?
Chodzi mi o to, że jak najadę przykładowo na "Forums" to pokażą się pod menu linki odpowiadające zakładce "Forums".
Pozdrawiam

Najszybciej, najprościej nie wiem czy do końca poprawnie ?

[HTML] pobierz, plaintext 
<script type="text/javascript">
$(document).ready(function() {
 $("#link1").hover(function() { $(".submenu1").fadeIn(500); }, function() { $(".submenu1").fadeOut(500); });
 });
</script>
 
 
<div id="link1">Link 1</div>
<div class="submenu1" style="display:none">Rozwijane</div>
[HTML] pobierz, plaintext 

Zobacz sobię to: http://api.jquery.com/category/effects/

Ale da się zrobić tak żeby współgrało z tym skryptem co mam? Przepraszam za moją ciemnotę, dopiero zaczynam zabawę z html.

//Edit. Zastosowałem to, lecz nie do końca zadowala mnie efekt. Chcę, żeby po samym najechaniu pojawiało się submenu, ale również jak puszczę kursor z danego elementu, żeby to submenu zostawało, ponieważ hover zostaje. http://www.robertmendak.com/edyta2/

Nie powinno mieć to żadnego wpływu na Twój skrypt o ile dobrze przypiszesz klasy, ale podałem Ci taki przykład jak można to zrobić jednak to tego potrzebujesz jeszcze napisać CSS żeby w odpowiednim miejscu się wyświetlało i jakoś wyglądało

Jak chcesz menu rozwijalne zobacz sobie to: http://api.jquery.com/slideDown/ tam masz przykład.

Tak, wiem. CSS dopiszę na wygląd później. najpierw chcę żeby to poprawie działało, ponieważ nie ma sensu bawić się z tym skoro nie ma żądanego efektu. Przeczytaj notkę w moim poście wyżej.

Zobacz sobię tą stronę, którą podałem wcześniej tam jest sporo przykładów: http://api.jquery.com/category/effects/

[HTML] pobierz, plaintext 
$(document).ready(function() {
 $("#link1").hover(function() { $(".submenu1").fadeIn(500); }, function() { $(".submenu1").fadeOut(500); });
 });
[HTML] pobierz, plaintext 

Po najechaniu pokazuje ( fadeIn ) po zjechaniu z elementu zniaka ( fadeOut ), 500 to szybkość.

Usuń drugą cześć skryptu ( fadeOut ) i nie będzie znikać, ale wtedy będzie cały czas. Więc wtedy ustawiesz, że na przykład po najechaniu na drugi element znika, a pojawia się submenu dla drugiego i tak dalej. Trzeba się tym trochę pobawić na stronie api.jquery jest wszystko fajnie opisane

No i niestety pojawiają się schody. http://www.robertmendak.com/edyta2/

[HTML] pobierz, plaintext 
<ul id="gooeymenu4" class="framemenu">
<!-- 1 -->
<li><a href="http://www.dynamicdrive.com/">
<div id="link1">Home</div></a>
<div class="submenu1" style="display:none">Rozwijane</div>
</li>
 
<!-- 2 -->
<li><a href="http://www.dynamicdrive.com/">
<div id="link1">Home3</div></a>
<div class="submenu1" style="display:none">Rozwijane</div>
</li>
 
<!-- 3 -->
<li><a href="http://www.dynamicdrive.com/">
<div id="link1">Home4</div></a>
<div class="submenu1" style="display:none">Rozwijane</div>
</li>
</ul>
[HTML] pobierz, plaintext 

Gdy najeżdżam na Home1 - pokazują się wszystkie rowijane.
Gdy najeżdżam na Home2 - nic się nie dzieje

Nie bez powodu nazywałem je link1 i submenu1 , dla każdego elementu musisz nadac inną nazwę oraz dodać kolejną linię kodu js, czyli coś w ten deseń

[HTML] pobierz, plaintext 
<div id="link1">Home</div></a>
 
<div class="submenu1" style="display:none">Rozwijane</div>
 
<div id="link2">Home</div></a>
 
<div class="submenu2" style="display:none">Rozwijane</div>
 
 
$(document).ready(function() {
 
 $("#link1").hover(function() { $(".submenu1").fadeIn(500); }, function() { $(".submenu1").fadeOut(500); });
 $("#link2").hover(function() { $(".submenu2").fadeIn(500); }, function() { $(".submenu1").fadeOut(500); });
 
 });
[HTML] pobierz, plaintext 

I tak dla pozostałych tam 5 czy 6


Tak w skrócie postaram się opisać Ci jak to działa.

Dla elementu o id 1 ( #link1 ) przypisujesz funkcję, która pokaże ( fadeIn ) przypisany do niego element o klasie ( .submenu1 ), a po zjechaniu kursorem schowa ten element ( .submenu1 ) przy uzyciu funkcji ( fadeOut ). Jeżeli chcesz wywołać podobną akcję dla innego elementu to wtedy przypisujesz w skrypcie inne id/klasy i w skrycie robisz to samo, zobacz jak to teraz zrobiłem i analogicznie robisz resztę.

Faktycznie. Działa. Nie jestem dobry w JS. Kolejne schody ^^
Jak najadę na Home3, 'Rozwijane' z Home1 powinno zniknąć, lecz zostaje

Pisałem Ci o tym musisz trochę pokombinować sobie poczytać Tak na szybko

[HTML] pobierz, plaintext 
 $("#link3").hover(function() { $(".submenu3").fadeIn(500); $(".submenu1").fadeOut(500) });
[HTML] pobierz, plaintext 

Jak działa to powyżej: Po najechaniu na link 3 ( #link3 ) pokaż submenu 3 ( .submenu3 ), a ukryj ( fadeOut ) submenu1 ( .submenu1 )


Jak ukryc dwa elementu po najechaniu na link3 ( #link3 )

[HTML] pobierz, plaintext 
 $("#link3").hover(function() { $(".submenu3").fadeIn(500); $(".submenu1, .submenu2").fadeOut(500) });
[HTML] pobierz, plaintext 

Możesz to sobie przyśpieszyć pod 500 masz czas pojawiania ( fadeIn ) oraz znikania ( fadeOut ) dla znikania polecam ustawić na 100 lub 200 żeby na siebie nie nachodziły elementu.

Ok, działa. Dziękuje bardzo. Ostatnie 2 pytanka mam, czy da się zrobić jedną klasę żeby ustalić pozycję tych submenu, czy trzeba każdą klasę pokolei? Jak mogę zrobić, żeby to submenu się pokazywało na dole na swoim miejscu? Bo zabrakło mi już pomysłów. Próbowałem display:none; display:block; float:left; i nic z tego.

Możesz zrobić to w ten sposób na przykładzie ostatniego kodu, ale lekko go zmodyfikować:

[HTML] pobierz, plaintext 
<div id="link1">Home</div></a>
 
<div id="submenu1" class="dlawszystkichsubmenu" style="display:none">Rozwijane</div>
 
<div id="link2">Home</div></a>
 
<div id="submenu2" class="dlawszystkichsubmenu" style="display:none">Rozwijane</div>
 
$(document).ready(function() {
 $("#link1").hover(function() { $("#submenu1").fadeIn(500); }, function() { $("#submenu1").fadeOut(500); });
 $("#link2").hover(function() { $("#submenu2").fadeIn(500); }, function() { $("#submenu1").fadeOut(500); });
 });
 
 
//css
 
.dlawszystkichsubmenu { float:left; ... lub co tam wstawisz }
 
#submenu 1 { tutaj możesz dla każdego submenu oddzielnie }
#submenu 2 { tutaj możesz dla każdego submenu oddzielnie }
 
[HTML] pobierz, plaintext 

Zwróć uwagę, że dla submenu przypisaliśmy teraz id ( #submenu1 )w js a nie klasę ( .submenu ) jak poprzednio.

Odnośnie pozycji submenu to duże ma znaczenie gdzie umieścisz ten element w kodzie html, w którym wierszu. Możesz go umieścić w stopce i tam właśnie się pojawi. Poczytaj o position:absolute choć to nie do końca może poprawnie. Nie wiem też jak to graficznie ma wyglądać jak Ty chcesz to zrobić

Już rozumiem! To wszystko co chciałem wiedzieć Dziękuje Ci za pomoc. Można temat zamknąć