101_praktycznych_skryptow_na_strone_WWW_101psw.pdf

IDZ DO

PRZYK£ADOW Y ROZDZIA£

101 praktycznych skryptów

na stronie WWW

SPIS TRECI

KATALOG KSI¥¯EK

Autor: Marcin Lis

ISBN: 83-7197-879-0

Format: B5, stron: 196

KATALOG ONLINE

ZAMÓW DRUKOWANY KATALOG

TWÓJ KOSZYK

DODAJ DO KOSZYKA

Aby stworzyæ atrakcyjn¹ stronê WWW, nie wystarcza ju¿ znajomoæ jêzyka HTML.

Witryny wzbogacone przyci¹gaj¹cymi uwagê u¿ytkownika animacjami i elementami

interaktywnymi to w Internecie codziennoæ. Umieszczenie na stronie tych elementów

czêsto przerasta umiejêtnoci pocz¹tkuj¹cego webmastera.

„101 praktycznych skryptów na stronê WWW” to ksi¹¿ka prezentuj¹ca gotowe do

wykorzystania, praktyczne skrypty napisane w jêzyku JavaScript, które sprawi¹,

¿e strona "o¿yje" i stanie siê bardziej atrakcyjna dla odbiorcy.

Dodaj do swojej strony skrypty obs³uguj¹ce:

• Formularze

• Odnoniki

• P³ywaj¹ce napisy

• Efekty t³a

• Animacje warstw

Ksi¹¿ka przeznaczona jest zarówno dla osób pocz¹tkuj¹cych, jak i rednio

zaawansowanych (znaj¹cych podstawy HTML-a, JavaScriptu czy DHTML-a). Ka¿dy

skrypt jest przedstawiony w postaci gotowej do uruchomienia. Wystarczy zatem wkleiæ

go do swojej witryny, zupe³nie nie przejmuj¹c siê technicznymi aspektami jego

dzia³ania, aby osi¹gn¹æ zamierzony efekt. Dla osób bardziej zaawansowanych

zaprezentowane w ksi¹¿ce pomys³y mog¹ byæ inspiracj¹ do tworzenia w³asnych

projektów.

CENNIK I INFORMACJE

ZAMÓW INFORMACJE

O NOWOCIACH

ZAMÓW CENNIK

CZYTELNIA

FRAGMENTY KSI¥¯EK ONLINE

Wydawnictwo Helion

ul. Chopina 6

44-100 Gliwice

tel. (32)230-98-63

e-mail: helion@helion.pl

Spis treci

Wstp ............................................................................................... 7

Rozdział 1.

Proste zdarzenia i obsługa myszy........................................................ 9

Skrypt 1. Zdarzenie onLoad. Powitanie uytkownika [E][N][O]..................................10

Skrypt 2. Zdarzenie onUnload. Poegnanie uytkownika [E][N][O]............................11

Skrypt 3. Powitanie i poegnanie korzystaj$ce z podanego imienia [E][N][O]............11

Skrypt 4. Okno dialogowe wy(wietlane po najechaniu mysz$ na tekst [E][N6][O] .....13

Skrypt 5. Zamykanie okna przegl$darki [E][N][O].......................................................14

Skrypt 6. Zamykanie okna przegl$darki potwierdzane przez uytkownika [E][N][O].15

Skrypt 7. Zmiana napisu na pasku stanu [E][N][O].......................................................17

Skrypt 8. Zmiana kursora myszy na „celownik” [E][N6]..............................................18

Skrypt 9. Wybór kształtu kursora z listy [E]..................................................................19

Skrypt 10. Blokowanie funkcji prawego przycisku myszy [E] .......................................22

Skrypt 11. Blokada prawego przycisku myszy rozróniaj$ca typ przegl$darki [E][N]...24

Skrypt 12. Blokada lewego przycisku myszy [E]............................................................26

Rozdział 2.

Skrypty zwizane z formularzami....................................................... 29

Skrypt 13. Sprawdzenie ilo(ci formularzy w dokumencie [E][N][O] ..............................30

Skrypt 14. Sprawdzenie czy uytkownik podał wymagane dane [E][N][O]....................31

Skrypt 15. Nadanie niewypełnionym polom zadanej warto(ci [E][N][O]........................35

Skrypt 16. Kalkulator wykonuj$cy podstawowe działania arytmetyczne [E][N6][O] .....37

Skrypt 17. Przeszukiwanie tekstu [E][N][O] ....................................................................42

Skrypt 18. Przycisk zmieniaj$cy kolor po najechaniu na8 kursorem myszy [E][N6] ......44

Skrypt 19. Przycisk samoczynnie zmieniaj$cy kolor [E][N6]..........................................47

Skrypt 20. Jednoczesna zmiana koloru przycisku i tekstu na przycisku [E][N6].............49

Skrypt 21. Automatyczne przenoszenie kursora

mi;dzy elementami formularza [E][N][O].....................................................................50

Skrypt 22. Zablokowanie moliwo(ci wpisywania liter w formularzu [E].......................52

Skrypt 23. Pole tekstowe automatycznie zmieniajace swoj$ wielko(< [E].......................53

Rozdział 3.

Okna i czas ..................................................................................... 55

Skrypt 24. Otworzenie nowego, pustego okna przegl$darki [E][N].................................56

Skrypt 25. Otworzenie nowego okna, o zadanych rozmiarach i zawarto(ci [E][N].........58

Skrypt 26. Wy(wietlenie ostrzeenia o niewła(ciwej rozdzielczo(ci ekranu [E][N][O] ..60

Skrypt 27. Zmiana koloru paska przewijania [E]..............................................................61

Skrypt 28. Odmierzanie czasu [E][N][O] .........................................................................63

Skrypt 29. Odmierzanie czasu z moliwo(ci$ zatrzymania zegara [E][N][O] .................65

Skrypt 30. Przewijanie tre(ci strony [E][O]......................................................................65

Skrypt 31. Pływaj$cy ekran [E][N4][O] ...........................................................................68

Skrypt 32. Uciekaj$cy ekran [E][O]..................................................................................69

101 praktycznych skryptów na stronie WWW

Skrypt 33. Zegar cyfrowy [E][N][O] ................................................................................69

Skrypt 34. Wy(wietlenie aktualnej daty i czasu [E][N][O] ..............................................72

Skrypt 35. Wy(wietlenie aktualnej daty i czasu na przycisku [E][N][O].........................74

Skrypt 36. Wy(wietlenie aktualnej daty i czasu na pasku stanu [E][N][O]......................75

Skrypt 37. Wy(wietlenie bie$cego dnia tygodnia [E][N][O]..........................................76

Skrypt 38. Wy(wietlenie warto(ci zwi$zanych z dat$ i czasem [E][N][O] ......................78

Skrypt 39. Zegar podaj$cy czas w formacie binarnym [E][N][O]....................................81

Rozdział 4.

Odno'niki ........................................................................................ 83

Skrypt 40. Automatyczne załadowanie strony [E][N][O].................................................83

Skrypt 41. Automatyczne załadowanie strony bez uycia JavaScriptu [E][N][O]...........84

Skrypt 42. Przyciski b;d$ce jednocze(nie odno(nikami [E][N][O]..................................85

Skrypt 43. Odno(niki na li(cie rozwijanej [E][N][O] .......................................................86

Skrypt 44. Odno(niki na li(cie rozwijanej z bezpo(redni$ zmian$ strony [E][N][O].......88

Skrypt 45. Odsyłacze z dodatkowymi opisami [E][N][O]................................................88

Skrypt 46. Odno(niki na li(cie rozwijanej otwierane w nowym oknie [E][N] .................90

Skrypt 47. Odno(niki na li(cie rozwijanej z moliwo(ci$ wyboru okna [E][N]...............92

Skrypt 48. Uniemoliwienie wczytania strony do ramki [E][N][O].................................93

Skrypt 49. Dodawanie odsyłacza do zakładki „Ulubione” [E].........................................94

Skrypt 50. Ustawianie wybranej strony jako startowej [E]...............................................95

Skrypt 51. Akapit tekstowy udaj$cy odno(nik [E][N6][O]...............................................96

Skrypt 52. Dodatkowe wyrónienie odno(nika [E] ..........................................................97

Rozdział 5.

Pływajce napisy ........................................................................... 101

Skrypt 53. Napis przesuwaj$cy si; w poziomie w lewo [E][N][O]................................101

Skrypt 54. Napis przesuwaj$cy si; w poziomie w lewo

uwzgl;dniaj$cy wielko(< okna tekstowego [E][N6][O]...............................................102

Skrypt 55. Pływaj$cy tekst odbijaj$cy si; od lewej i prawej strony [E][O]....................104

Skrypt 56. Zamiana tekstu przez losowe wstawianie znaków [E][N][O].......................105

Skrypt 57. Zamiana tekstów poprzez wymian; znaków od prawej strony [E][N][O]....107

Skrypt 58. Zamiana tekstów poprzez wymian; znaków od lewej strony [E][N][O]......108

Skrypt 59. Symulacja pisania na klawiaturze [E][N][O] ................................................109

Skrypt 60. Tekst rozwijany w praw$ stron; i zwijany w lewo [E][N][O] ......................111

Skrypt 61. Tekst rozwijany w praw$ stron; i zwijany w prawo [E][N][O]....................112

Skrypt 62. Pływaj$cy tekst na pasku stanu [E][N][O] ....................................................113

Skrypt 63. Pływaj$ca data na pasku stanu [E][N][O] .....................................................114

Skrypt 64. Pływaj$ca data i czas na pasku stanu [E][N][O] ...........................................116

Skrypt 65. Pływaj$ca data i czas na pasku stanu II [E][N][O]........................................117

Skrypt 66. Data i czas na pasku stanu pływaj$ca w obie strony [E][N][O]....................119

Skrypt 67. Pływaj$cy tekst na pasku tytułu okna przegl$darki [E][N6][O]....................120

Skrypt 68. Zegarek w tytule okna [E][N6][O]................................................................122

Rozdział 6.

Efekty tła ...................................................................................... 125

Skrypt 69. Tło zmieniaj$ce si; po najechaniu na obrazek [E][N6].................................125

Skrypt 70. Tło zmieniaj$ce si; po najechaniu na obrazek II [E][N6].............................127

Skrypt 71. Wybór koloru tła z listy rozwijanej [E][N] ...................................................128

Skrypt 72. Tło zmieniaj$ce cyklicznie kolor [E][N].......................................................129

Skrypt 73. Tło zmieniaj$ce kolor losowo [E][N]............................................................130

Skrypt 74. Tło zmieniaj$ce kolor losowo II [E][N] ........................................................131

Skrypt 75. Zmiana koloru tła w komórce tabeli [E][N6]................................................132

Skrypt 76. Wybór koloru tła przy uyciu myszy [E][N6]...............................................134

Skrypt 77. Wybór koloru tła przy uyciu myszy II [E][N6]...........................................136

Skrypt 78. Pływaj$ce tło [E][N6]....................................................................................139

Skrypt 79. Tło przesuwaj$ce si; w poziomie [E][N6] ....................................................140

Skrypt 80. Tło z cyklicznie zmieniaj$cych si; obrazów [E][N6] ...................................141

Spis treci

Skrypt 81. Tło z losowo zmieniaj$cych si; obrazów [E][N6] ........................................142

Skrypt 82. Rozja(nianie tła [E][N]..................................................................................143

Skrypt 83. Cciemnianie tła [E][N]...................................................................................144

Skrypt 84. Pulsowanie tła [E][N]....................................................................................144

Rozdział 7.

Animacje warstw ........................................................................... 147

Skrypt 85. Uciekaj$cy obrazek [E][N6][O] ....................................................................147

Skrypt 86. Pływaj$ca warstwa [E][N4][O] .....................................................................151

Skrypt 87. Pulsuj$cy tekst [E][N6][O]............................................................................152

Skrypt 88. Tekst płynnie zmieniaj$cy kolor [E][N6]......................................................153

Skrypt 89. Efekt kurtyny [E][O] .....................................................................................156

Skrypt 90. Wygenerowane dynamicznie tło [E][N4]......................................................158

Skrypt 91. Kurtyna z dynamicznie generowanymi warstwami [E][N4][O] ...................161

Skrypt 92. Obrazek odbijaj$cy si; od boków ekranu [E][O]..........................................164

Skrypt 93. Skalowanie obrazka [E][N6] .........................................................................165

Skrypt 94. Pulsuj$cy obrazek [E][N6] ............................................................................167

Skrypt 95. Spadaj$ce warstwy [E][O].............................................................................168

Skrypt 96. Spadaj$ce warstwy generowane dynamicznie [E][O]...................................171

Skrypt 97. Płatki (niegu przemieszczaj$ce si; w dwóch kierunkach [E][O]..................173

Skrypt 98. Realistycznie padaj$cy (nieg [E][O] .............................................................175

Skrypt 99. Odbijaj$ca si; piłka [E][O]............................................................................177

Skrypt 100. Piłka poruszaj$ca si; po sinusoidzie [E][N6][O] ........................................180

Skrypt 101. Pływaj$ce warstwy [E][N][O].....................................................................181

Zako/czenie .................................................................................. 185

Skrypt 102. Pływaj$ca sinusoida [E][N][O] ...................................................................185

Skorowidz...................................................................................... 189

Rozdział 7.

Animacje warstw

Skrypt 85. [E][N6][O]

Uciekajcy obrazek.

Na ekranie wywietlany jest obrazek zapisany w pliku image1.gif (rysunek 7.1). B-

dzie zmieniał miejsce poło!enia po najechaniu na niego mysz$. W funkcji

ustawiamy poło!enie warstwy w zale!noci od rozdzielczoci ekranu. Słu!y nam tutaj

do tego obiekt i jego właciwoci i odzwierciedlaj$ce odpowied-

nio wysoko( i szeroko( ekranu.

Rysunek 7.1.

Widoczny obrazek

bdzie „uciekał”

przed wskanikiem

myszy

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika: