Wstęp

  W Internecie można znaleźć wiele kursów Java Script i DHTML. Nie każdy z tych kursów wart jest uwagi i chyba żaden nie wyczerpuje tematu całkowicie. Dlatego postanowiłem dodać coś od siebie i stworzyć zbiór przydatnych i nadających się do szybkiej modyfikacji skryptów DHTML przy okazji pokrótce je opisując. Nie będą one super skomplikowane ale mam nadzieje, że użyteczne i pomogą wzbogacić Wasze strony WWW. 
  Zanim zaczniemy pisać skrypty trzeba powiedzieć kilka słów wstępu. 
Przede wszystkim należy przerobić lekcję HTML traktując o warstwach, jeżeli kto? ma jakie? zaległości z tego tematu odsyłam do, moim zdaniem bardzo dobrego kursu Pawła Wimmera. Oczywiście warto znać choćby podstawy JavaScript, w Internecie jest mnóstwo materiałów na ten temat. 

Teraz już o DHTML 

  Ścieżki dostępu do poszczególnych parametrów DHTML różnią się, niestety, w dwóch, najczęściej używanych typach przeglądarek. Dla Internet Explorera: document.all["nazwa warsty"].style.parametr, dla Netscapea: document.layers["nazwa warsty"].parametr
Nie wiemy jakiej przeglądarki używa goszczący na naszej stronie wędrowiec, dlatego aby nasz skrypt był wykonany musimy to sprawdzić. Najczęściej polecane jest wstawienie, wewnątrz znaczników Script, następującego kawałka kodu:
ns4=(document.layers)? true:false
ie4=(document.all)? true:false

  Ważne jest aby ten kawałek kodu znalazł się na każdej stronie którą chcemy wzbogacić o skrypty DHTML. Kiedy już nasza strona "wie" z jakiej przeglądarki korzysta nasz gość może wykonać funkcję odpowiednio dla jednej lub drugiej. 
  Bardzo spodobała mi się idea tzw. zmiennych wskazujących zawarta w kursie Dana Steinmana przetłumaczony przez Adama Kozubowicza. Dotychczas z tego kursu najwięcej się nauczyłem i czasami będę się na nim opierał. Polega ona na utworzeniu zmiennej która w zależności od typu przeglądarki przyjmuje wartość document.layers["nazwa warstwy"] (dla NS) lub document.all["nazwa warstwy"].style (dla IE). Tworząc funkcję która dla każdej używanej przez nas warstwy nada zmiennej odpowiednią wartość a następnie uruchamiając ja wraz z załadowaniem strony możemy pozbyć się podziału na części wykonywane w IE i NS w prawie każdej funkcji. W prawie każdej, niestety nie w dzisiejszej lekcji, ale po kolei.

  Funkcja nadająca zmiennym odpowiednie wartości:
function zmienne() 
{if (ns4) {warstwaa=document.layers["warstwa1"] warstwab=document.layers["warstwa2"] .....itd. w zależności ile warstw mamy }

if (ie4) {warstwaa=document.all["warstwa1"].style warstwab=document.all["warstwa2"].style .....itd w zależno?ci ile warstw mamy } }

  Funkcja pokazująca i ukrywająca warstwy.
Widoczność warstw określa się za pomocą parametru visibility. Niestety oprócz różnic w ścieżkach dostępu w obu typach przeglądarek różne są wartości tego parametru. 
Aby pokazać warstwę:
IE: visible
NS: show
aby jš ukryć
IE: hidden
NS: hide

  Zanim zaczniemy pisać funkcję musimy stworzyć warstwy którymi będziemy się posługiwać: DIV id= warstwa1 style="position: absolute; top: 60; left: 10; width: 290; height: 70; background-color: red; layer-background-color: red". Pozostałe 2 warstwy będą się nazywać odpowiednio warstwa2 i warstwa3, będą miału oczywiście inną treść, a pozostałe parametry pozostają bez zmian. Teraz już możemy napisać naszą funkcję:
function pokaz(x, y, z) - wpisujemy odpowiednio tyle argumentów na ilu warstwach ma być wykonywana nasza funkcja a następnie
{if (ns4) {x.visibility="show" y.visibility="hide" z.visibility="hide"};
if (ie4) {x.visibility="visible" y.visibility="hidden" z.visibility="hidden"}

  W ten sposób nazwa warstwy która będzie pierwszym argumentem funkcji po jej wywołaniu będzie widoczna a pozostałe ukryte.
Oczywiście można pozbyć się podziału na części wykonywane przez NS i IE modyfikując odpowiednio funkcję zmienne ale w tym wypadku wydaje się to niepotrzebne. Teraz wystarczy uruchomić funkcję np. za pomocą przycisków.
FORM
input type=button value="warstwa1" onClick="pokaz(warstwaa, warstwab, warstwac)"
input type=button value="warstwa2" onClick="pokaz(warstwab, warstwaa, warstwac)"
input type=button value="warstwa3" onClick="pokaz(warstwac, warstwab, warstwaa)" 
/FORM
  Tutaj znajdziecie przykład 
  Domyślnie widoczna będzie warstwa która jest ostatnia w naszej grupie i jest niejako "najwyżej na kupce". Pozycję warstw w stosie możemy modyfikować za pomocą parametru z-index, ale o tym w następnej lekcji.