101_praktycznych_skryptow_na_strone_WWW_101psw.pdf

(426 KB) Pobierz
IDZ DO
PRZYK£ADOWY ROZDZIA£
SPIS TRE CI
KATALOG KSI¥¯EK
KATALOG ONLINE
ZAMÓW DRUKOWANY KATALOG
101 praktycznych skryptów
na stronie WWW
Autor: Marcin Lis
ISBN: 83-7197-879-0
Format: B5, stron: 196
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êtno ci 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
Odno niki
P³ywaj¹ce napisy
Efekty t³a
Animacje warstw
CENNIK I INFORMACJE
ZAMÓW INFORMACJE
O NOWO CIACH
ZAMÓW CENNIK
CZYTELNIA
FRAGMENTY KSI¥¯EK ONLINE
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.
Wydawnictwo Helion
ul. Chopina 6
44-100 Gliwice
tel. (32)230-98-63
e-mail: helion@helion.pl
Spis treści
Wstęp ............................................................................................... 7
Rozdział 1. Proste zdarzenia i obsługa myszy........................................................ 9
Skrypt 1.
Skrypt 2.
Skrypt 3.
Skrypt 4.
Skrypt 5.
Skrypt 6.
Skrypt 7.
Skrypt 8.
Skrypt 9.
Skrypt 10.
Skrypt 11.
Skrypt 12.
Zdarzenie onLoad. Powitanie u ytkownika [E][N][O]..................................10
Zdarzenie onUnload. Po egnanie u ytkownika [E][N][O]............................11
Powitanie i po egnanie korzystające z podanego imienia [E][N][O] ............11
Okno dialogowe wyświetlane po najechaniu myszą na tekst [E][N6][O] .....13
Zamykanie okna przeglądarki [E][N][O] .......................................................14
Zamykanie okna przeglądarki potwierdzane przez u ytkownika [E][N][O] .15
Zmiana napisu na pasku stanu [E][N][O].......................................................17
Zmiana kursora myszy na „celownik” [E][N6]..............................................18
Wybór kształtu kursora z listy [E]..................................................................19
Blokowanie funkcji prawego przycisku myszy [E] .......................................22
Blokada prawego przycisku myszy rozró niająca typ przeglądarki [E][N]...24
Blokada lewego przycisku myszy [E] ............................................................26
Rozdział 2. Skrypty związane z formularzami....................................................... 29
Skrypt 13. Sprawdzenie ilości formularzy w dokumencie [E][N][O] ..............................30
Skrypt 14. Sprawdzenie czy u ytkownik 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 nań 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 mo liwoś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 ostrze enia 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 mo liwoś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
4
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 u ycia 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 mo liwością wyboru okna [E][N]...............92
Skrypt 48. Uniemo liwienie 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ływające 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 u yciu myszy [E][N6]...............................................134
Skrypt 77. Wybór koloru tła przy u yciu 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 treści
5
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. Ściemnianie 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]
Uciekający obrazek.
Na ekranie wyświetlany jest obrazek zapisany w pliku
image1.gif
(rysunek 7.1). Bę-
dzie zmieniał miejsce poło enia po najechaniu na niego myszą. W funkcji
KPKV
ustawiamy poło enie warstwy w zale ności od rozdzielczości ekranu. Słu y nam tutaj
do tego obiekt
UETGGP
i jego właściwości
JGKIJV
i
YKFVJ
odzwierciedlające odpowied-
nio wysokość i szerokość ekranu.
Rysunek 7.1.
Widoczny obrazek
będzie „uciekał”
przed wskaźnikiem
myszy

Plik z chomika:

Inne pliki z tego folderu:

Inne foldery tego chomika:

Zgłoś jeśli naruszono regulamin