DHTML

Karta pracy 2013/2014

Dokument:

http://www.plotkarka.eu/kp/dhtml.html

Autor:

Radosław Kowaluk

Ćwiczenia

Wstęp

Otwórz plik dhtml.html w przeglądarce internetowej.

Dynamiczna zmiana stylu¹ strony

W elemencie body dodaj kod i przetestuj skrypt.

<button onclick="document.body.style.color='black';">
Kolor tekstu - czarny
</button>

Dynamiczna zmiana stylów² strony

W elemencie body dodaj kod i przetestuj skrypt.

<button onclick="document.body.style.background='black';
document.body.style.color='white';">inwersja
</button>

Dynamiczna zmiana stylu zintegrowanego

W elemencie body dodaj kod i przetestuj skrypt.

<button onclick="document.body.style.font='12px Arial';">
Font - 12px Arial
</button>

Dynamiczna zmiana stylu elementu bieżącego³

W elemencie body dodaj kod i przetestuj skrypt.

<button onmouseover="this.style.padding='5px';">
Wyróżnienie
</button>

Dynamiczne zmiany stylu elementu⁴

W elemencie button dodaj kod i przetestuj skrypt.

<button onmouseover="this.style.padding='5px';"
 onmouseout="this.style.padding='0px';">
Wyróżnienie
</button>

Wgrywanie plików na serwer

Umieść pliki witryny na serwerze.

1.  <element zdarzenie="element.style.styl CSS='wartość'[;]"
2.  <element zdarzenie="element.style.styl CSS='wartość'; element.style.styl CSS='wartość'[;...]"
3.  <element zdarzenie="this.style.styl CSS='wartość'[;]"
4.  <element zdarzenie="element.style.styl CSS='wartość'[;]" zdarzenie="element.style.styl CSS='wartość'[;]" [...]