Przejdź do treści

Rozwijane menu

Wykorzystując element <select>...</select> można stworzyć rozwijane menu, które działa w ten sposób, że po wyborze konkretnej opcji z listy, następuje wczytanie określonej strony (podobnie jak w przypadku odsyłaczy). Może to być przydatne np. jeżeli chcemy zaoszczędzić trochę miejsca na stronie (lista rozwijalna zajmuje tylko jedną linijkę). Ale uwaga! Jeśli przeglądarka użytkownika nie będzie obsługiwać skryptów JavaScript, strony z takiego menu będą niedostępne. Dlatego zaleca się umieścić w innym miejscu również zwykłych odsyłaczy tekstowych.

<select onchange="self.location.href = this.value">
<option VALUE="adres1.html">Opis1</option>
<option VALUE="adres2.html">Opis2</option>
...
</select>
adres1.html, adres1.html
Adresy (lub względne ścieżki dostępu) stron, które chcemy wczytać po wybraniu danej pozycji na liście
Opis1, Opis2
Test, który pojawi się na liście i po wybraniu których nastąpi wczytanie stron

Można również zaznaczyć opcję domyślną (atrybut selected="selected"), aby wskazać która strona jest aktualnie wczytana.

Jeśli chcemy wczytać dokument do innej ramki, to w wartości atrybutu onchange="..." zamiast self należy wpisać: parent.nazwaramki albo top.nazwaramki. Natomiast w przypadku ramek lokalnych przydatne może okazać się wpisanie: self.nazwaramki.

Przykład:

Wybierz stronę do wczytania:

Komentarze

Zobacz więcej komentarzy