SlideShare une entreprise Scribd logo
1  sur  22
Télécharger pour lire hors ligne
IDZ DO
         PRZYK£ADOWY ROZDZIA£

                           SPIS TRE CI   JavaScript – przyk³ady.
                                         Biblia
           KATALOG KSI¥¯EK               Autor: Danny Goodman
                                         T³umaczenie: Piotr Rajca
                      KATALOG ONLINE     ISBN: 83-7197-671-2
                                         Tytu³ orygina³u: JavaScript Examples Bible:
       ZAMÓW DRUKOWANY KATALOG           The Essential Companion to JavaScript Bible
                                         Format: B5, stron: 522
              TWÓJ KOSZYK
                    DODAJ DO KOSZYKA     Niniejsza ksi¹¿ka stanowi wspania³e uzupe³nienie JavaScript. Biblia
                                         Ksi¹¿ka — autora bestsellera „JavaScript. Biblia” — to dziesi¹tki gotowych przyk³adów
                                         kodu, których mo¿esz u¿yæ na swoich stronach internetowych. Nawet je li
         CENNIK I INFORMACJE             przedstawionych przyk³adów nie wykorzystasz bezpo rednio, to zaznajomienie siê
                                         z nimi pomo¿e Ci poznaæ tajniki JavaScriptu. Mo¿esz je porównaæ ze swoimi skryptami.
                   ZAMÓW INFORMACJE      Ogromna wiedza i umiejêtno ci Danny'ego Goodmana mog¹ byæ dla Ciebie wspania³ym
                     O NOWO CIACH        punktem odniesienia. Dodatkowo zapoznaæ siê mo¿esz z jego warto ciowymi
                                         wskazówkami i uwagami towarzysz¹cymi fragmentom kodu.
                       ZAMÓW CENNIK      Je li chcesz wzbogaciæ swoje strony o interaktywne elementy utworzone
                                         w JavaScripcie, powiniene mieæ tê ksi¹¿kê zawsze pod rêk¹. Oszczêdzisz sobie
                                         w ten sposób wiele cennego czasu.
                 CZYTELNIA
          FRAGMENTY KSI¥¯EK ONLINE




Wydawnictwo Helion
ul. Chopina 6
44-100 Gliwice
tel. (32)230-98-63
e-mail: helion@helion.pl
5RKU VTG EK
1 #WVQTG  
9UVúR  
4QFKC  1DKGMV[ QIÎNP[EJ GNGOGPVÎY *6/. 
4QFKC  
  Najwa niejsze informacje o przykładach ..............................................................................................15
  Obiekty ogólne ......................................................................................................................................17
     Właściwości ....................................................................................................................................17
     Metody ............................................................................................................................................63
     Procedury obsługi zdarzeń ............................................................................................................107
4QFKC  1DKGMV[ YKPFQY QTC HTCOG 
4QFKC  
  Informacje o przykładach ....................................................................................................................138
  Obiekt window ....................................................................................................................................139
      Właściwości ..................................................................................................................................139
      Metody ..........................................................................................................................................162
      Procedury obsługi zdarzeń ............................................................................................................196
  Obiekt elementu FRAME....................................................................................................................198
      Właściwości ..................................................................................................................................198
  Obiekt elementu FRAMESET.............................................................................................................202
      Właściwości ..................................................................................................................................202
  Obiekt elementu IFRAME...................................................................................................................206
      Właściwości ..................................................................................................................................206
  Obiekt popup .......................................................................................................................................209
      Właściwości ..................................................................................................................................209
      Metody ..........................................................................................................................................210
4QFKC  1DKGMV[ NQECVKQP K JKUVQT[ 
4QFKC  
  Informacje o przykładach ....................................................................................................................213
  Obiekt location ....................................................................................................................................214
      Właściwości ..................................................................................................................................214
      Metody ..........................................................................................................................................224
  Obiekt history ......................................................................................................................................226
      Właściwości ..................................................................................................................................226
      Metody ..........................................................................................................................................226
4QFKC  1DKGMV[ FQEWOGPV QTC DQF[ 
4QFKC  
  Informacje o przykładach ....................................................................................................................232
  Obiekt document..................................................................................................................................232
,CXC5ETKRV                 RT[M CF[ $KDNKC


            Właściwości ..................................................................................................................................232
            Metody ..........................................................................................................................................249
            Procedury obsługi zdarzeń ............................................................................................................262
         Obiekt elementu BODY ......................................................................................................................263
            Właściwości ..................................................................................................................................263
            Metody ..........................................................................................................................................267
            Procedury obsługi zdarzeń ............................................................................................................267
    4QFKC  1DKGMV[ GNGOGPVÎY VGMUVQY[EJ 
4QFKC  
      Informacje o przykładach ....................................................................................................................270
      Obiekt elementu FONT .......................................................................................................................270
          Właściwości ..................................................................................................................................270
      Obiekt elementu HR ............................................................................................................................273
          Właściwości ..................................................................................................................................273
      Obiekt elementu MARQUEE..............................................................................................................277
          Właściwości ..................................................................................................................................277
          Metody ..........................................................................................................................................279
      Obiekt Range .......................................................................................................................................280
          Właściwości ..................................................................................................................................280
          Metody ..........................................................................................................................................282
      Obiekt selection ...................................................................................................................................295
          Właściwości ..................................................................................................................................295
          Metody ..........................................................................................................................................296
      Obiekty Text oraz TextNode ...............................................................................................................297
          Właściwości ..................................................................................................................................297
          Metody ..........................................................................................................................................297
      Obiekt TextRange................................................................................................................................301
          Właściwości ..................................................................................................................................301
          Metody ..........................................................................................................................................304
      Obiekt TextRectangle ..........................................................................................................................319
          Właściwości ..................................................................................................................................319
    4QFKC  1DKGMV[ +OCIG #TGC QTC /CR 
4QFKC   
      Informacje o przykładach ....................................................................................................................323
      Obiekt Image oraz obiekt elementu IMG ............................................................................................324
          Właściwości ..................................................................................................................................324
          Procedury obsługi zdarzeń ............................................................................................................335
      Obiekt elementu AREA.......................................................................................................................336
          Właściwości ..................................................................................................................................336
      Obiekt elementu MAP .........................................................................................................................337
          Właściwość....................................................................................................................................337
    4QFKC  1DKGMV HQTO QTC QDKGMV[  PKO YKæCPG 
4QFKC  
      Informacje o przykładach ....................................................................................................................342
      Obiekt FORM ......................................................................................................................................342
          Właściwości ..................................................................................................................................342
          Metody ..........................................................................................................................................345
          Procedury obsługi zdarzeń ............................................................................................................346
      Obiekt elementu LABEL.....................................................................................................................347
          Właściwości ..................................................................................................................................347
    4QFKC  1DKGMV DWVVQP 
4QFKC  
      Informacje o przykładach ....................................................................................................................350
      Obiekt elementu BUTTON oraz obiekty Button, Submit i Reset .......................................................350
5RKU VTG EK                          

        Właściwości ..................................................................................................................................350
        Metody ..........................................................................................................................................351
        Procedury obsługi zdarzeń ............................................................................................................352
     Obiekt checkbox ..................................................................................................................................353
        Właściwości ..................................................................................................................................353
        Procedury obsługi zdarzeń ............................................................................................................355
     Obiekt radio .........................................................................................................................................358
        Właściwości ..................................................................................................................................358
        Procedury obsługi zdarzeń ............................................................................................................360
4QFKC  1DKGMV[ VGMUVQY[EJ GNGOGPVÎY HQTOWNCT[ 
4QFKC   
  Informacje o przykładach ....................................................................................................................364
  Obiekt pola tekstowego .......................................................................................................................364
      Właściwości ..................................................................................................................................364
      Metody ..........................................................................................................................................369
      Procedury obsługi zdarzeń ............................................................................................................371
  Obiekt elementu TEXTAREA.............................................................................................................374
      Właściwości ..................................................................................................................................374
      Metody ..........................................................................................................................................374
4QFKC  1DKGMV[ UGNGEV QRVKQP QTC (KNG7RNQCF 
4QFKC   
  Informacje o przykładach ....................................................................................................................376
  Obiekt elementu SELECT ...................................................................................................................376
      Właściwości ..................................................................................................................................376
      Metody ..........................................................................................................................................382
      Procedury obsługi zdarzeń ............................................................................................................382
  Obiekt elementu OPTION ...................................................................................................................384
      Właściwości ..................................................................................................................................384
  Obiekt elementu OPTGROUP.............................................................................................................384
      Właściwości ..................................................................................................................................384
4QFKC  1DKGMV[ VCDGN K NKUV 
4QFKC  
  Informacje o przykładach ....................................................................................................................388
  Obiekt elementu TABLE.....................................................................................................................388
      Właściwości ..................................................................................................................................388
      Metody ..........................................................................................................................................396
  Obiekty elementów TBODY, TFOOT oraz THEAD..........................................................................397
      Właściwości ..................................................................................................................................397
  Obiekty elementów COL oraz COLGROUP ......................................................................................397
      Właściwości ..................................................................................................................................397
  Obiekt elementu TR.............................................................................................................................398
      Właściwości ..................................................................................................................................398
  Obiekty elementów TD oraz TH .........................................................................................................399
      Właściwości ..................................................................................................................................399
  Obiekt elementu OL ............................................................................................................................401
      Właściwości ..................................................................................................................................401
  Obiekt elementu UL ............................................................................................................................402
      Właściwości ..................................................................................................................................402
  Obiekt elementu LI..............................................................................................................................402
      Właściwości ..................................................................................................................................402
,CXC5ETKRV                 RT[M CF[ $KDNKC


    4QFKC  1DKGMV PCXKICVQT QTC KPPG QDKGMV[ TQFQYKUMQYG
                    
4QFKC   
      Informacje o przykładach ....................................................................................................................404
      Obiekt clientInformation (IE 4+) oraz navigator (wszystkie przeglądarki) ........................................404
          Właściwości ..................................................................................................................................404
          Metody ..........................................................................................................................................411
      Obiekt screen .......................................................................................................................................412
          Właściwości ..................................................................................................................................412
      Obiekt userProfile................................................................................................................................413
          Metody ..........................................................................................................................................413
    4QFKC  1DKGMV[ FCTG 
4QFKC   
      Informacje o przykładach ....................................................................................................................416
      Obiekt event (NN 4) ............................................................................................................................417
          Właściwości ..................................................................................................................................417
      Obiekt event (IE 4+) ............................................................................................................................420
          Właściwości ..................................................................................................................................420
      Obiekt event (NN 6+) ..........................................................................................................................429
    4QFKC  1DKGMV[ UV[NÎY K CTMWU[ UV[NÎY 
4QFKC   
      Informacje o przykładach ....................................................................................................................441
      Obiekt styleSheet.................................................................................................................................442
          Właściwości ..................................................................................................................................442
          Metody ..........................................................................................................................................444
      Obiekty cssRule oraz rule....................................................................................................................446
          Właściwości ..................................................................................................................................446
    4QFKC  1DKGMV[ WOKGLUEQYKQPG 
4QFKC   
      Informacje o przykładach ....................................................................................................................450
      Obiekt layer stosowany w przeglądarce NN 4 ......................................................................................450
          Właściwości ..................................................................................................................................450
          Metody ..........................................................................................................................................469
    4QFKC  1DKGMV[ 5VTKPI /CVJ 0WODGT K $QQNGCP 
4QFKC [  K   
      Informacje o przykładach ....................................................................................................................476
      Obiekt String........................................................................................................................................476
          Właściwości ..................................................................................................................................476
          Metody rozbioru łańcuchów..........................................................................................................477
      Obiekt Number ....................................................................................................................................489
          Właściwości ..................................................................................................................................489
          Metody ..........................................................................................................................................490
    4QFKC  1DKGMV #TTC[ 
4QFKC   
      Informacje o przykładach ....................................................................................................................492
      Metody obiektu Array .........................................................................................................................492
    5MQTQYKF
4QFKC 
1DKGMV[ +OCIG #TGC
QTC /CR 
4QFKC 
    9 V[O TQFKCNG
        Jak pobierać obrazy do pamięci podręcznej i zamieniać obrazy wyświetlane
        na stronie
        Wykonywanie czynności bezpośrednio po pobraniu obrazu
        Tworzenie interaktywnych map odnośników obsługiwanych po stronie klienta

    Obiekty elementów +/) są bardzo często wykorzystywane w skryptach, głównie dlatego,
    i są one stosowane w rozwiązaniach polegających na zamienianiu obrazów wyświetla-
    nych na stronie. Poza tym mo liwość wykorzystania tych obiektów w skryptach była
    dostępna niemal ju w pierwszych wersjach przeglądarek obsługujących język Java-
    Script. W rozwiązaniach obejmujących zamienianie obrazów pomocniczą rolę odgrywa
    obiekt +OCIG, wykorzystywany w celu pobrania obrazu z serwera od pamięci podręcznej
    przeglądarki (dzięki czemu obraz wyświetlony na stronie mo na błyskawicznie zamie-
    nić na inny). Choć z punktu widzenia skryptów te obiekty są ró ne, mają wiele wspól-
    nych właściwości i metod, dzięki czemu poznanie sposobów ich wykorzystania jest
    znacznie prostsze.

    Obiekty elementów #4'# oraz /#2 ściśle ze sobą współpracują. W praktyce element #4'#
    przypomina nieco obiekt # u ywany do definiowania połączeń. Oba elementy tworzą
    bowiem na stronie „miejsca”, które u ytkownik mo e kliknąć, co zazwyczaj powoduje
    przejście na inną stronę witryny lub do dowolnego innego miejsca Sieci. Te obiekty
    mają tak e wiele wspólnych właściwości związanych z adresami URL.


+PHQTOCELG Q RT[M CFCEJ
        Większość wersji przeglądarki Internet Explorer jest w stanie wyświetlać elementy
        +/) zawierające zarówno obrazy nieruchome, jak i „ruchome” (na przykład, klipy
        wideo zapisane w formacie MPEG). Przykład przedstawiony na listingu 22.3
        pokazuje w jaki sposób, przy u yciu właściwości F[PUTE, mo na zastąpić obraz
        stały obrazem ruchomym.
,CXC5ETKRV       RT[M CF[ $KDNKC


             Strona przedstawiona na listingu 22.4 pozwala na porównanie efektywności
             zamieniania obrazów przechowywanych w pamięci podręcznej przeglądarki
             i pobieranych bezpośrednio z serwera. Skrypt pokazuje tak e w jaki sposób mo na
             cyklicznie zamieniać obrazy w określonych odstępach czasu.
             Listing 22.5 pokazuje w jaki sposób mo na wykonywać czynności w odpowiedzi
             na zdarzenie QP.QCF obrazu.
             Na listingu 22.7 został przedstawiony skrypt o bardzo du ych mo liwościach,
             pokazujący w jaki sposób, po zmianie obrazu wyświetlanego w elemencie +/),
             mo na zastosować nową mapę odnośników obsługiwaną po stronie przeglądarki.


1DKGMV +OCIG QTC QDKGMV GNGOGPVW +/)

9 C EKYQ EK

         CNKIP

                      NN 2   NN 3     NN 4    NN 6      IE 3/J1 IE 3/J2 IE 4    IE 5    IE 5.5
           Zgodność


         2T[M CF

         Strona przedstawiona na listingu 22.1 pozwala na przypisywanie ró nych wartości właści-
         wości CNKIP, określającej poło enie wewnątrzwierszowego obrazu w stosunku do sąsia-
         dującego z nim tekstu. Spróbuj zmieniać wielkość okna przeglądarki, aby tekst wyświe-
         tlany na stronie był w ró ny sposób dzielony i przyjrzyj się, jaki wpływ na układ strony
         mają wybierane wartości wyrównania obrazu. Nie wszystkie przeglądarki udostępniają
         unikatowe mo liwości wyrównania odpowiadające wszystkim podanym opcjom, a zatem
         spróbuj przetestować stronę w wielu ró nych przeglądarkach.

.KUVKPI  Testowanie właściwości align obrazów
           *6/.
           *'#
           6+6.' 9 C EKYQ è CNKIP QDKGMVW +/)6+6.'
           5%4+26 .#0)7#)' ,CXC5ETKRV

           HWPEVKQP UGV#NKIPOGPV
UGN ]
               FQEWOGPVO[+/)CNKIP  UGNQRVKQPU=UGNUGNGEVGF+PFGZ?VGZV
           _
           5%4+26
           *'#
           $1;
           * 9 C EKYQ è CNKIP QDKGMVW +/)*
           *4
           (14/
           9[DKGT URQUÎD Y[TÎYPCPKC
           5'.'%6 QP%JCPIG UGV#NKIPOGPV
VJKU
4QFKC       1DKGMV[ +OCIG #TGC QTC /CR 
4QFKC                     

     126+10 CDUDQVVQO
     126+10 CDUOKFFNG
     126+10 DCUGNKPG
     126+10 5'.'%6' DQVVQO
     126+10 NGHV
     126+10 OKFFNG
     126+10 TKIJV
     126+10 VGZVVQR
     126+10 VQR
 5'.'%6
 (14/
 *4
 2 .QTGO KRUWO FQNQT UKV COGV EQPUGEVGVCWT CFKRKUKEKPI GNKV
 UGF FQ GKWUOQF VGORQT KPEKFKFWPV WV NCDQTG GV FQNQTG OCIPC
 CNKSWC +/) 0#/' O[+/) 54% FGUMIKH *'+)*6 9+6*
 7V GPKO CFOKPKO XGPKCO SWKU PQUVTWF GZGTEKVCVKQP
 WNNCOEQ NCDQTKU PKUK WV CNKSWKR GZ GC EQOOQFQ EQPUGSWCV2
 $1;
 *6/.



CNV

            NN 2     NN 3     NN 4     NN 6    IE 3/J1 IE 3/J2 IE 4       IE 5     IE 5.5
 Zgodność


2T[M CF

Określanie wartości właściwości CNV obrazów mo na wypróbować na stronie Tester (przed-
stawionej w rozdziale 13. ksią ki „JavaScript. Biblia”). Celem tego przykładu jest przypisa-
nie łańcucha znaków właściwości CNV obiektu FQEWOGPVO[+/). Rozpocznij od usunięcia
obrazu wyświetlonego na stronie; w tym celu właściwości UTE przypisz nazwę nieist-
niejącego pliku:
 FQEWOGPVO[+/)UTE  DTCMAVGIQARNKMWIKH

Jeśli przewiniesz stronę, zobaczysz na niej puste miejsce po obrazie. Teraz określ wartość
właściwości UTE:
 FQEWOGPVO[+/)CNV  $WKC (TGFC

Przewiń zawartość strony, aby przekonać się czy alternatywny tekst został wyświetlony.
Jeśli w łańcuchu znaków zapisywanym we właściwości CNV chcesz umieścić apostrof
bądź cudzysłów (lub jeden z kilku innych znaków, które w języku JavaScript mają spe-
cjalne znaczenie), to musisz poprzedzić go znakiem odwrotnego ukośnika.

DQTFGT

            NN 2     NN 3     NN 4     NN 6    IE 3/J1 IE 3/J2 IE 4       IE 5     IE 5.5
 Zgodność
,CXC5ETKRV      RT[M CF[ $KDNKC


         2T[M CF

         Skutki określania wartości właściwości DQTFGT obrazów mo emy wypróbować na stronie
         Tester (posługując się zdefiniowanym na niej obrazem FQEWOGPVO[+/)). Przeprowadzając
         testy, przypisuj tej właściwości liczby całkowite o ró nej wartości.

         EQORNGVG

                      NN 2   NN 3    NN 4    NN 6     IE 3/J1 IE 3/J2 IE 4     IE 5    IE 5.5
           Zgodność


         2T[M CF

         Przed otwarciem strony z listingu 22.2 prezentującej zastosowanie właściwości KOCIG
         EQORNGVG, zamknij i ponownie otwórz przeglądarkę (w ten sposób będziesz miał pew-
         ność, e adne obrazy nie znajdują się w jej pamięci podręcznej). Podczas pobierania
         ka dego z obrazów sprawdzaj stan właściwości EQORNGVG obiektu KOCIG — klikaj w tym
         celu przycisk Czy obraz ju pobrano. Do momentu zakończenia pobierania obrazu wła-
         ściwość ta będzie mieć wartość HCNUG, potem przyjmie wartość VTWG. Na naszej przykła-
         dowej stronie u ywane są dwa obrazy, przy czym obraz prezentujący łuk skalny jest
         większy. Być mo e pomiędzy kolejnymi próbami będziesz musiał zamykać i ponownie
         otwierać przeglądarkę, aby usunąć obraz z pamięci podręcznej (lub opró nić całą pamięć
         podręczną przeglądarki). Jeśli wykorzystanie właściwości EQORNGVG we własnych skryptach
         będzie Ci przysparzać problemów, to spróbuj zdefiniować procedurę obsługi zdarzeń
         QP.QCF w znaczniku +/) (podobnie jak na listingu 22.2, mo e to być zupełnie pusta
         procedura obsługi zdarzeń).

.KUVKPI  Skrypt wykorzystujący właściwość image.complete
           *6/.
           *'#
           5%4+26 .#0)7#)' ,CXC5ETKRV
           HWPEVKQP NQCF+V
VJG+OCIGHQTO ]
               HQTOTGUWNVXCNWG 
               FQEWOGPVKOCIGU=?UTE  VJG+OCIG
           _
           HWPEVKQP EJGEM.QCF
HQTO ]
               HQTOTGUWNVXCNWG  FQEWOGPVKOCIGU=?EQORNGVG
           _
           5%4+26
           *'#
           $1;
           +/) 54% ERWIKH 9+6* *'+)*6 QP.QCF
           (14/
           +0276 6;2' DWVVQP 8#.7' 9[ YKGVN MNCYKCVWTú
             QP%NKEM NQCF+V
 ERWIKH VJKUHQTO
           +0276 6;2' DWVVQP 8#.7' 9[ YKGVN FLúEKG WMW UMCNPGIQ
             QP%NKEM NQCF+V
 CTEJIKH VJKUHQTO 2
           +0276 6;2' DWVVQP 8#.7' %[ QDTC LW RQDTCPQ QP%NKEM EJGEM.QCF
VJKUHQTO
           +0276 6;2' VGZV 0#/' TGUWNV
4QFKC      1DKGMV[ +OCIG #TGC QTC /CR 
4QFKC               

           (14/
           $1;
           *6/.



         F[PUTE

                       NN 2      NN 3   NN 4   NN 6      IE 3/J1 IE 3/J2 IE 4   IE 5    IE 5.5
           Zgodność


         2T[M CF

         Aby w obiekcie +/) wyświetlać obrazy nieruchome bądź ruchome, wystarczy odpowiednio
         określać wartości właściwości UTE oraz F[PUTE — zapisywać nazwę pliku obrazu w jednej
         z nich, a pusty łańcuch znaków w drugiej. Bardzo prosty przykład, wyświetlający na
         przemian jeden obraz stały oraz jeden klip wideo, został przedstawiony na listingu 22.3.
         Przedstawiony przykład demonstruje poprawny sposób zamieniania obrazów nierucho-
         mych na ruchome (i na odwrót), umo liwiający uniknięcie błędów najczęściej popeł-
         nianych w takich sytuacjach (opisanych w tekście ksią ki).

.KUVKPI  Naprzemienne wyświetlanie obrazu nieruchomego i ruchomego
           *6/.
           *'#
           6+6.' 9 C EKYQ è F[PUTE QDKGMVW +/)6+6.'
           5%4+26 .#0)7#)' ,CXC5ETKRV

           XCT VTCKP+OI  PGY +OCIG

           VTCKP+OIUTE  COVTCMLRI
           VTCKP+OIF[PUTE  COVTCMORI

           HWPEVKQP UGV.QQR
 ]
               XCT UGNGEVQT  FQEWOGPVHQTOU=?NQQRGT
               FQEWOGPVO[+/)NQQR  UGNGEVQTQRVKQPU=UGNGEVQTUGNGEVGF+PFGZ?XCNWG
           _

           HWPEVKQP UGV+OCIG
V[RG ]
               KH 
V[RG  LRI  ]
                   FQEWOGPVO[+/)F[PUTE 
                   FQEWOGPVO[+/)UTE  VTCKP+OIUTE
               _ GNUG ]
                   FQEWOGPVO[+/)UTE 
                   FQEWOGPVO[+/)UVCTV  HKNGQRGP
                   UGV.QQR

                   FQEWOGPVO[+/)F[PUTE  VTCKP+OIF[PUTE
               _
           _
           5%4+26
           *'#
           $1;
           * 9 C EKYQ è F[PUTE QDKGMVW +/)*
           *4
           (14/
           9[DKGT V[R QDTCW
,CXC5ETKRV       RT[M CF[ $KDNKC


       +0276 6;2' TCFKQ 0#/' KOI)TQWR %*'%-' QP%NKEM UGV+OCIG
 LRI  0KGTWEJQO[
       +0276 6;2' TCFKQ 0#/' KOI)TQWR QP%NKEM UGV+OCIG
 ORI  9KFGQ
       2 +NG TC[ QFVYQT[è MNKR YKFGQ RQ RQDTCPKW 5'.'%6 0#/' NQQRGT
         QP%JCPIG UGV.QQR

           126+10 8#.7' 5'.'%6' TC
           126+10 8#.7' FYC TC[
           126+10 8#.7' Y PKGUMQ EQPQ è
       5'.'%6 2
       (14/
       *4
       +/) 0#/' O[+/) 54% COVTCMLRI *'+)*6 9+6*
       $1;
       *6/.


      Jeśli skrypt jawnie nie przypisze właściwości UVCTV wartości HKNGQRGP (jak w powy -
      szym przykładzie), to aby odtworzyć klip, u ytkownicy przeglądarek Internet Explorer
      dla komputerów Macintosh będą musieli kliknąć go dwa razy (IE 4) lub raz (IE 5).

      HKNG%TGCVGFCVG
      HKNG/QFKHKGFCVG
      HKNG5KG

                  NN 2    NN 3     NN 4    NN 6     IE 3/J1 IE 3/J2 IE 4     IE 5     IE 5.5
       Zgodność


      2T[M CF

      Wszystkie trzy omawiane tu właściwości są podobne od analogicznych właściwości
      obiektu FQEWOGPV. Przykład ich wykorzystania został przedstawiony na listingu 18.4. Jeśli
      chcesz wypróbować omawiane właściwości obiektu obrazu, to skopiuj stronę przedsta-
      wioną na listingu 18.4, dodaj do niej element +/), a następnie zastąp odwołania do wła-
      ściwości obiektu FQEWOGPV odwołaniami do odpowiedniego obiektu elementu +/).

      JGKIJV
      YKFVJ

                  NN 2    NN 3     NN 4    NN 6     IE 3/J1 IE 3/J2 IE 4     IE 5     IE 5.5
       Zgodność


      2T[M CF

      Właściwości JGKIJV oraz YKFVJ mo na wypróbować na stronie Tester (przedstawionej
      w rozdziale 13. ksią ki „JavaScript. Biblia”). Zacznij od pobrania domyślnych wartości
      tych właściwości. W tym celu w górnym polu tekstowym formularza wpisz następujące
      wyra enia:
       FQEWOGPVO[+/)JGKIJV
       FQEWOGPVO[+/)YKFVJ
4QFKC       1DKGMV[ +OCIG #TGC QTC /CR 
4QFKC                   

Następnie zmień wysokość obrazu z 90 do 180 pikseli:
 FQEWOGPVO[+/)JGKIJV  

Gdy przewiniesz stronę i wyświetlisz obraz, oka e się, e został on przeskalowany (aby
zachować oryginalne proporcje). W końcu podaj nową szerokość obrazu:
 FQEWOGPVO[+/)YKFVJ  

i przyjrzyj się efektom wprowadzonych modyfikacji.

JURCEG
XURCEG

            NN 2     NN 3      NN 4   NN 6    IE 3/J1 IE 3/J2 IE 4      IE 5     IE 5.5
 Zgodność


2T[M CF

Do sprawdzenia właściwości JURCEG i XURCEG mo na u yć strony Tester (opisanej w roz-
dziale 13. ksią ki „JavaScript. Biblia”). W pierwszej kolejności upewnij się, e obraz wy-
świetlony na samym końcu strony nie ma adnych marginesów i jest wyświetlony tu
przy lewej krawędzi okna przeglądarki. Następnie zmień szerokość poziomego margi-
nesu na 30 pikseli:
 FQEWOGPVO[+/)JURCEG  

Wykonanie powy szej instrukcji spowoduje odsunięcie obrazu od lewej krawędzi strony
na odległość 30 pikseli. Margines o tej samej szerokości został umieszczony tak e z prawej
strony obrazu, choć nie jest on widoczny na stronie.

KU/CR

            NN 2     NN 3      NN 4   NN 6    IE 3/J1 IE 3/J2 IE 4      IE 5     IE 5.5
 Zgodność


2T[M CF

Obraz wyświetlony u dołu strony Tester nie został zdefiniowany jako mapa odnośników.
Z tego względu, jeśli w górnym polu tekstowym formularza wyświetlonego na tej stronie
wpiszesz poni sze wyra enie i klikniesz przycisk Oblicz, to w polu poni ej zostanie
wyświetlona wartość HCNUG:
 FQEWOGPVO[+/)KU/CR


NQQR

            NN 2     NN 3      NN 4   NN 6    IE 3/J1 IE 3/J2 IE 4      IE 5     IE 5.5
 Zgodność
,CXC5ETKRV      RT[M CF[ $KDNKC


      2T[M CF

      Przykład wykorzystania właściwości NQQR został przedstawiony na listingu 22.3, zamiesz-
      czonym w opisie właściwości F[PUTE.

      NQYUTE
      NQY5TE

                  NN 2    NN 3    NN 4    NN 6     IE 3/J1 IE 3/J2 IE 4     IE 5    IE 5.5
       Zgodność


      2T[M CF

      Wpływ właściwości określających plik źródłowy obrazu na przetwarzanie zdarzeń został
      przedstawiony na listingu 22.5, podanym w opisie procedury obsługi zdarzeń QP.QCF.

      PCOG

                  NN 2    NN 3    NN 4    NN 6     IE 3/J1 IE 3/J2 IE 4     IE 5    IE 5.5
       Zgodność                                    ( )


      2T[M CF

      Do sprawdzenia wartości właściwości PCOG mo na wykorzystać stronę Tester (przedsta-
      wioną w rozdziale 13. ksią ki „JavaScript. Biblia”). W górnym polu tekstowym formu-
      larza wpisz następujące wyra enie:
       FQEWOGPVO[+/)PCOG

      Oczywiście, powy szy przykład jest nieco bezsensowny, gdy nazwa obrazu stanowi
      fragment u ytego odwołania.

      PCOG2TQR

                  NN 2    NN 3    NN 4    NN 6     IE 3/J1 IE 3/J2 IE 4     IE 5    IE 5.5
       Zgodność


      2T[M CF

      Do porównania wartości właściwości UTE i PCOG2TQR w przeglądarce IE 5+ dla systemu
      Windows mo na u yć strony Tester (przedstawionej w rozdziale 13. ksią ki „JavaScript.
      Biblia”). W górnym polu tekstowym formularza wpisz ka de z poni szych wyra eń:
       FQEWOGPVO[+/)UTE
       FQEWOGPVO[+/)PCOG2TQR
4QFKC      1DKGMV[ +OCIG #TGC QTC /CR 
4QFKC                  

RTQVQEQN

            NN 2     NN 3   NN 4     NN 6    IE 3/J1 IE 3/J2 IE 4      IE 5    IE 5.5
 Zgodność


2T[M CF

Do sprawdzenia wartości właściwości RTQVQEQN obiektu reprezentującego obraz mo na
u yć strony Tester. W górnym polu tekstowym formularza wpisz poni sze wyra enie:
 FQEWOGPVO[+/)RTQVQEQN


UTE

            NN 2     NN 3   NN 4     NN 6    IE 3/J1 IE 3/J2 IE 4      IE 5    IE 5.5
 Zgodność                                    ( )


2T[M CF

W przykładzie przedstawionym na listingu 22.4 pokazanych zostało kilka ró nych zasto-
sowań obiektów reprezentujących obrazy. Podstawowym celem tego przykładu jest przed-
stawienie ró nic w efektywności zamieniania obrazów przechowywanych w pamięci
podręcznej przeglądarki oraz pobieranych bezpośrednio z serwera. Dodatkowo skrypt
pokazuje w jaki sposób automatycznie zamieniać wyświetlane obrazy w podanych odstę-
pach czasu. Rozwiązanie to jest bardzo często stosowane na witrynach wyświetlających
paski z reklamami.

W momencie pobierania strony, w zmiennej globalnej zapisywana jest tablica obiektów
+OCIG. Poszczególne komórki tej tablicy są indeksowane łańcuchami znaków reprezen-
tującymi nazwy obrazów (na przykład: FGUM , FGUM i tak dalej). Rozwiązanie to zo-
stało wykorzystane celowo, gdy skrypt będzie się odwoływał do poszczególnych komórek
tablicy właśnie przy u yciu tych nazw. Ka demu obiektowi +OCIG zapisanemu w tablicy
zostaje przypisany adres URL obrazu. Dzięki temu obrazy zostają pobrane i zapisane
w pamięci podręcznej przeglądarki.

Na stronie zostały zdefiniowane dwa elementy +/) (patrz rysunek 6.1). Pierwszy z nich
wyświetla obrazy pobierane bezpośrednio z serwera, a drugi — obrazy pobierane z pa-
mięci podręcznej. Poni ej ka dego z elementów +/) zostaje wyświetlona rozwijana lista
pozwalająca na wybranie jednego z czterech obrazów, który ma zostać wyświetlony
w danym elemencie +/). W procedurach obsługi zdarzeń QP%JCPIG elementów 5'.'%6
wywoływane są dwie ró ne funkcje — w przypadku obrazów pobieranych z serwera
wywoływana jest funkcja NQCF+PFKXKFWCN
, a w przypadku obrazów pobieranych z pa-
mięci podręcznej — funkcja NQCF%CEJGF
. W wywołaniach obu funkcji podawany jest
jeden argument — odwołanie do formularza zawierającego elementy 5'.'%6.

Za cykliczną zmianę obrazów co 5 sekund odpowiada funkcja EJGEM6KOGT
, która w pierw-
szej kolejności sprawdza czy jest zaznaczone odpowiednie pole wyboru. Jeśli pole zostało
,CXC5ETKRV       RT[M CF[ $KDNKC




4[UWPGM  Strona demonstrująca wykorzystanie obiektów Image
(Obrazy © Aris Multimedia Inc., 1994)

          zaznaczone, to funkcja pobiera wartość właściwości UGNGEVGF+PFGZ listy słu ącej do wyboru
          obrazu pobieranego z pamięci podręcznej. Następnie wartość ta jest inkrementowana
          (lub zmniejszana do zera, jeśli przekroczyła pewną maksymalną wartość), a odpowied-
          nia lista zostaje zaktualizowana. Po wykonaniu powy szych czynności skrypt mo e ju
          wywołać funkcję NQCF%CEJGF
, która określa wybrany element listy i wyświetla odpo-
          wiedni obraz.

          Dodatkowo, w znaczniku $1; została zdefiniowana procedura obsługi zdarzenia QP7P
          NQCF, która wywołuje funkcję TGUGV5GNGEVU
. Ta ogólna funkcja przegląda wszystkie
          formularze zdefiniowane na stronie i odnajduje w nich wszystkie elementy 5'.'%6.
          W ka dym z odnalezionych elementów, funkcja przypisuje właściwości UGNGEVGF+PFGZ
          wartość . Dzięki temu, jeśli u ytkownik odświe y stronę lub wróci na nią w wyniku
          kliknięcia przycisku Wstecz (Back), to obrazy będą odtwarzane w oryginalnej kolejności.
          Procedura obsługi zdarzenia QP.QCF zapewnia, e wyświetlane obrazy będą odpowiadać
          opcjom wybranym na odpowiadającym im listach, a po 5 sekundach zostanie wywołana
          funkcja EJGEM6KOGT
. Nale y jednak zwrócić uwagę, i obrazy pobierane z pamięci
          podręcznej przeglądarki są zamieniane wyłącznie wówczas, gdy u ytkownik zaznaczy
          pole wyboru wyświetlone u dołu strony.

.KUVKPI  Obsługa obiektu image za pomocą skryptu i zamienianie obrazów
           *6/.
           *'#
           6+6.' 1DKGM +OCIG6+6.'
4QFKC      1DKGMV[ +OCIG #TGC QTC /CR 
4QFKC                   

5%4+26 .#0)7#)' ,CXC5ETKRV
 INQDCNPG FGMNCTCELG VCDNKE[ QDTCÎY
XCT KOCIG$

 QDTC[ RTGEJQY[YCPG Y RCOKúEK RQFTúEPGL
KH 
FQEWOGPVKOCIGU ]
     FNC Y[IQF[ CRKUWLGO[ VGMUVQYG KPFGMU[ VCDNKE[ Y HQTOKG NKUV[
    XCT FGUM+OCIGU  PGY #TTC[
 FGUM  FGUM  FGUM  FGUM 
     VYQT[O[ VCDNKEú QDKGMVÎY +OCIG K RQDKGTCO[ QDTC[ FQ
     RCOKúEK RQFTúEPGL
    KOCIG$  PGY #TTC[

    HQT 
XCT K   K  KOCIG$NGPIVJ  K

 ]
        KOCIG$=FGUM+OCIGU=K??  PGY +OCIG

        KOCIG$=FGUM+OCIGU=K??UTE  FGUM+OCIGU=K? 
 IKH
    _
_

 OKGPKCO[ QDTC RQDKGTCP[ DGRQ TGFPKQ  UGTYGTC
HWPEVKQP NQCF+PFKXKFWCN
HQTO ]
    KH 
FQEWOGPVKOCIGU ]
        XCT IKH0COG  HQTOKPFKXKFWCNQRVKQPU=HQTOKPFKXKFWCNUGNGEVGF+PFGZ?XCNWG
        FQEWOGPVVJWODPCKNUTE  IKH0COG 
 IKH
    _
_

 OKGPKCO[ QDTC RTGEJQY[YCP[ Y RCOKúEK RQFTúEPGL
HWPEVKQP NQCF%CEJGF
HQTO ]
    KH 
FQEWOGPVKOCIGU ]
        XCT IKH+PFGZ  HQTOECEJGFQRVKQPU=HQTOECEJGFUGNGEVGF+PFGZ?XCNWG
        FQEWOGPVVJWODPCKNUTE  KOCIG$=IKH+PFGZ?UTE
    _
_

 LG NK RQNG Y[DQTW QUVC Q CPCEQPG VQ RQDKGTCO[
 MQNGLP[ QDTC RTGEJQY[YCP[ Y RCOKúEK RQFTúEPGL
HWPEVKQP EJGEM6KOGT
 ]
    KH 
FQEWOGPVKOCIGU    FQEWOGPV6KOGTVKOGT$QZEJGEMGF ]
        XCT IKH+PFGZ  FQEWOGPVUGNGEVKQPUECEJGFUGNGEVGF+PFGZ
        KH 


IKH+PFGZ KOCIG$NGPIVJ   ]
            IKH+PFGZ  
        _
        FQEWOGPVUGNGEVKQPUECEJGFUGNGEVGF+PFGZ  IKH+PFGZ
        NQCF%CEJGF
FQEWOGPVUGNGEVKQPU
        XCT VKOGQWV+  UGV6KOGQWV
 EJGEM6KOGT
 
    _
_

 RQFECU WUWYCPKC UVTQP[  RTGINæFCTMK QFVYCTCO[ QT[IKPCNP[
 UVCP NKUV TQYKLCP[EJ
HWPEVKQP TGUGV5GNGEVU
 ]
    HQT 
XCT K   K  FQEWOGPVHQTOUNGPIVJ K

 ]
        HQT 
XCT L   L  FQEWOGPVHQTOU=K?GNGOGPVUNGPIVJ L

 ]
            KH 
FQEWOGPVHQTOU=K?GNGOGPVU=L?V[RG  UGNGEVQPG  ]
                FQEWOGPVHQTOU=K?GNGOGPVU=L?UGNGEVGF+PFGZ  
            _
        _
    _
_
 KPKELWLGO[ FKC CPKG UMT[RVW
,CXC5ETKRV      RT[M CF[ $KDNKC


       HWPEVKQP KPKV
 ]
           NQCF+PFKXKFWCN
FQEWOGPVUGNGEVKQPU
           NQCF%CEJGF
FQEWOGPVUGNGEVKQPU
           UGV6KOGQWV
 EJGEM6KOGT
 
       _
        5%4+26
       *'#

       $1; QP.QCF KPKV
 QP7PNQCF TGUGV5GNGEVU 

       * 1DKGMV +OCIG*
       *4
       %'06'4
       6#$.' $14'4 %'..2#+0)
       64 6* 6* 6* $GRQ TGFPKQ  UGTYGTC6* 6*  RCOKúEK RQFTúEPGL6* 64
       64 6 #.+)04+)*6 $ 1DTC$ 6
       6 +/) 54% ERWIKH 0#/' VJWODPCKN *'+)*6 9+6* 6
       6 +/) 54% FGUMIKH 0#/' VJWODPCKN *'+)*6 9+6* 6
       64
       64 6 #.+)04+)*6 $ 9[DKGT QDTC$ 6
       (14/ 0#/' UGNGEVKQPU
       6
       5'.'%6 0#/' KPFKXKFWCN QP%JCPIG NQCF+PFKXKFWCN
VJKUHQTO
       126+10 8#.7' ERW TWV[
       126+10 8#.7' ERW -NCYKCVWTC
       126+10 8#.7' ERW [UMKGVMK
       126+10 8#.7' ERW -CDNG
       5'.'%6
       6
       6
       5'.'%6 0#/' ECEJGF QP%JCPIG NQCF%CEJGF
VJKUHQTO
       126+10 8#.7' FGUM )WOMK
       126+10 8#.7' FGUM 5RKPCEG
       126+10 8#.7' FGUM .CORC
       126+10 8#.7' FGUM )WOMK 
       5'.'%6 6
       (14/
       64 6#$.'
       (14/ 0#/' 6KOGT
       +0276 6;2' EJGEMDQZ 0#/' VKOGT$QZ QP%NKEM EJGEM6KOGT
 %[MNKEPKG OKGPKCL
         QDTC[ RQDKGTCPG  RCOKúEK RQFTúEPGL
       (14/
       %'06'4
       $1;
       *6/.



      UVCTV

                  NN 2    NN 3    NN 4     NN 6    IE 3/J1 IE 3/J2 IE 4      IE 5    IE 5.5
       Zgodność


      2T[M CF

      Sposób wykorzystania właściwości UVCTV na stronie, która wyświetla klip wideo w ele-
      mencie +/), został przedstawiony na listingu 22.3, zamieszczonym we wcześniejszej części
      tego rozdziału.
4QFKC      1DKGMV[ +OCIG #TGC QTC /CR 
4QFKC                   

     Z
     [

                 NN 2     NN 3    NN 4    NN 6     IE 3/J1 IE 3/J2 IE 4     IE 5     IE 5.5
      Zgodność


     2T[M CF

     Aby przewinąć dokument w taki sposób, by obraz znalazł się o kilka pikseli poni ej górnej
     krawędzi okna przeglądarki, mo na u yć następującego wywołania:
      YKPFQYUETQNN6Q
FQEWOGPVKOCIGU=?Z 
FQEWOGPVKOCIGU=?[  


2TQEGFWT[ QDU WIK FCTG

     QP#DQTV
     QP'TTQT

                 NN 2     NN 3    NN 4    NN 6     IE 3/J1 IE 3/J2 IE 4     IE 5     IE 5.5
      Zgodność


     2T[M CF

     Na listingu 22.5 została zdefiniowana procedura obsługi zdarzeń QP#DQTV. Jeśli chcesz
     zapobiec wyświetlaniu obrazu, który ju znajduje się w pamięci podręcznej przeglądarki,
     będziesz musiał ją zamknąć i ponownie uruchomić. W przedstawionym przykładzie zapew-
     niłem mo liwość odświe ania całej strony. Sposób obsługi zdarzenia w głównej mierze
     zale y od projektu strony. Zawsze nale y jednak doło yć wszelkich starań, aby w jak
     największym stopniu ułatwić u ytkownikowi rozwiązywanie problemów, które mo e
     napotkać korzystając ze strony.

     QP.QCF

                 NN 2     NN 3    NN 4    NN 6     IE 3/J1 IE 3/J2 IE 4     IE 5     IE 5.5
      Zgodność


     2T[M CF

     Przed wypróbowaniem przykładu przedstawionego na listingu 22.5 powinieneś zamknąć
     i ponownie uruchomić przeglądarkę. Gdy dokument jest otwierany po raz pierwszy, po-
     czątkowo zostaje wyświetlony obraz określony za pomocą atrybutu .1954% (przedsta-
     wiający, w tym przypadku, gumki do ołówków), a dopiero później zdjęcie klawiatury.
     Gdy zdjęcie gumek zostanie ju pobrane, procedura obsługi zdarzenia QP.QCF wyświetla
     w polu tekstowym słowo FQPG . Dzieje się tak niezale nie od tego, e główny obraz
     (określony przy u yciu atrybut 54%) nie został jeszcze pobrany. Kolejny eksperyment
,CXC5ETKRV      RT[M CF[ $KDNKC


         mo e polegać na pobraniu zdjęcia przedstawiającego łuk skalny. Pobranie tego obrazu
         zabiera znacznie więcej czasu, a zatem obraz tymczasowy określany dynamicznie za
         pomocą atrybutu .1954% zostanie wyświetlony znacznie wcześniej.

.KUVKPI  Procedura obsługi zdarzeń onLoad obrazów
           *6/.
           *'#
           5%4+26 .#0)7#)' ,CXC5ETKRV
           HWPEVKQP NQCF+V
VJG+OCIGHQTO ]
               KH 
FQEWOGPVKOCIGU ]
                   HQTOTGUWNVXCNWG 
                   FQEWOGPVKOCIGU=?NQYUTE  FGUMIKH
                   FQEWOGPVKOCIGU=?UTE  VJG+OCIG
               _
           _
           HWPEVKQP EJGEM.QCF
HQTO ]
               KH 
FQEWOGPVKOCIGU ]
                   HQTOTGUWNVXCNWG  FQEWOGPVKOCIGU=?EQORNGVG
               _
           _
           HWPEVKQP UKIPCN
 ]
               KH
EQPHKTO
 2TGTYC G RQDKGTCPKG QDTCW %[ EJEGU RQDTCè IQ LGUEG TC!  ]
                   NQECVKQPTGNQCF

               _
           _
           5%4+26
           *'#
           $1;
           +/) 54% ERWIKH .1954% FGUMIKH 9+6* *'+)*6 QP.QCF KH
             
FQEWOGPVHQTOU=?TGUWNV FQEWOGPVHQTOU=?TGUWNVXCNWG FQPG QP#DQTV UKIPCN

           (14/
           +0276 6;2' DWVVQP 8#.7' 9[ YKGVN MNCYKCVWTú
             QP%NKEM NQCF+V
 ERWIKH VJKUHQTO
           +0276 6;2' DWVVQP 8#.7' 9[ YKGVN WM UMCNP[
             QP%NKEM NQCF+V
 CTEJIKH VJKUHQTO 2
           +0276 6;2' DWVVQP 8#.7' %[ QDTC LW RQDTCPQ! QP%NKEM EJGEM.QCF
VJKUHQTO
           +0276 6;2' VGZV 0#/' TGUWNV
           (14/
           $1;
           *6/.




1DKGMV GNGOGPVW #4'#

9 C EKYQ EK

         EQQTFU
         UJCRG

                      NN 2   NN 3    NN 4     NN 6    IE 3/J1 IE 3/J2 IE 4     IE 5    IE 5.5
           Zgodność
4QFKC       1DKGMV[ +OCIG #TGC QTC /CR 
4QFKC                    

         2T[M CF

         Sposób wykorzystania właściwości EQQTFU oraz UJCRG w skryptach obsługujących obiekty
         elementów /#2 został przedstawiony na listingu 22.7.


1DKGMV GNGOGPVW /#2

9 C EKYQ è

         CTGCU

                     NN 2     NN 3    NN 4     NN 6     IE 3/J1 IE 3/J2 IE 4      IE 5     IE 5.5
          Zgodność


         2T[M CF

         Listing 22.7 demonstruje jak mo na zmieniać obiekty elementów #4'# umieszczone we-
         wnątrz elementu /#2. Początkowo na stronie jest wyświetlany obraz przedstawiający kla-
         wiaturę. Obraz ten jest skojarzony z mapą odnośników MG[DQCTF/CR obsługiwaną po
         stronie klienta i definiującą trzy wybrane obszary na klawiaturze. Jeśli u ytkownik zamieni
         obraz wyświetlany na stronie wewnątrz elementu +/), skrypt zmieni tak e wartość wła-
         ściwości WUG/CR obiektu elementu +/), tak aby wskazywała na drugi element /#2, znacznie
         lepiej dostosowany do nowego obrazu. Spróbuj przesuwać wskaźnik myszy w obszarze
         obu obrazów i sprawdź adresy URL skojarzone z poszczególnymi obszarami mapy, wy-
         świetlane na pasku stanu (w tym przykładzie, strony docelowe określane przez te adresy
         nie istnieją).

         Kliknięcie przycisku Wygeneruj mapę powoduje jednak wywołanie funkcji OCMG#TGCU

         tworzącej cztery nowe obiekty elementów #4'# i dodającej je do mapy skojarzonej z ob-
         razem (przy u yciu odwołań charakterystycznych dla DOM u ywanej przeglądarki).
         (Nale y zauwa yć, e funkcja OCMG#TGCU
 nie działa w przeglądarkach IE 5 dla kom-
         puterów Macintosh). Przesuwając wskaźnik myszy w obszarze obrazu po wygenerowaniu
         nowych obiektów elementów #4'#, mo emy zauwa yć, e wyświetlane są nowe adresy
         URL. Warto tak e zwrócić uwagę na pojawienie się czterech nowych obszarów; komu-
         nikaty o nich są wyświetlane na pasku stanu przeglądarki (patrz rysunek 6.2).

.KUVKPI  Dynamiczne modyfikowanie elementów AREA
          *6/.
          *'#
          6+6.' 1DKGMV GNGOGPVW /#26+6.'
          5%4+26 .#0)7#)' ,CXC5ETKRV
           F[PCOKEPKG IGPGTWLGO[ GNGOGPV[ #4'#
          HWPEVKQP OCMG#TGCU
 ]
              FQEWOGPVO[+/)UTE  FGUMIKH
               VYQT[O[ QDKGMV[ GNGOGPVÎY CTGC
              XCT CTGC  FQEWOGPVETGCVG'NGOGPV
 #4'#
,CXC5ETKRV      RT[M CF[ $KDNKC


           CTGCJTGH  5ETKRV/CFG5JCFGJVON
           CTGCUJCRG  RQN[IQP
           CTGCEQQTFU  
           XCT CTGC  FQEWOGPVETGCVG'NGOGPV
 #4'# 
           CTGCJTGH  5ETKRV/CFG$CUGJVON
           CTGCUJCRG  TGEV
           CTGCEQQTFU  
           XCT CTGC  FQEWOGPVETGCVG'NGOGPV
 #4'# 
           CTGCJTGH  5ETKRV/CFG%JCKPJVON
           CTGCUJCRG  RQN[IQP
           CTGCEQQTFU  
           XCT CTGC  FQEWOGPVETGCVG'NGOGPV
 #4'# 
           CTGCJTGH  5ETKRV/CFG'ORV[PGUUJVON
           CTGCUJCRG  TGEV
           CTGCEQQTFU  
            YUVCYKCO[ PQYG GNGOGPV[ FQ Yú ÎY RQFTúFP[EJ GNGOGPVW /#2
           KH 
FQEWOGPVCNN ]
                MQF FNC +'
               FQEWOGPVCNNNCORAOCRCTGCUNGPIVJ  
               FQEWOGPVCNNNCORAOCRCTGCU=?  CTGC
               FQEWOGPVCNNNCORAOCRCTGCU=?  CTGC
               FQEWOGPVCNNNCORAOCRCTGCU=?  CTGC
               FQEWOGPVCNNNCORAOCRCTGCU=?  CTGC
           _ GNUG KH 
FQEWOGPVIGV'NGOGPV$[+F ]
                00 LGUV IQFP[  OQFGNGO Yú ÎY 9%
               XCT OCR1DL  FQEWOGPVIGV'NGOGPV$[+F
 NCORAOCR 
               YJKNG 
OCR1DLEJKNF0QFGUNGPIVJ ]
                   OCR1DLTGOQXG%JKNF
OCR1DLHKTUV%JKNF
               _
               OCR1DLCRRGPF%JKNF
CTGC
               OCR1DLCRRGPF%JKNF
CTGC
               OCR1DLCRRGPF%JKNF
CTGC
               OCR1DLCRRGPF%JKNF
CTGC
                TQYKæCPKG RTQDNGOW  Y[ YKGVNCPKGO Y 00
               FQEWOGPVO[+/)UV[NGFKURNC[  KPNKPG
           _
       _

       HWPEVKQP EJCPIG6Q-G[DQCTF
 ]
           FQEWOGPVO[+/)UTE  ERWIKH
           FQEWOGPVO[+/)WUG/CR  MG[DQCTF/CR
       _

       HWPEVKQP EJCPIG6Q.COR
 ]
           FQEWOGPVO[+/)UTE  FGUMIKH
           FQEWOGPVO[+/)WUG/CR  NCOR/CR
       _
       5%4+26
       *'#
       $1;
       * 1DKGMV GNGOGPVW /#2*
       *4
       +/) 0#/' O[+/) 54% ERWIKH 9+6* *'+)*6 75'/#2 MG[DQCTF/CR
       /#2 0#/' MG[DQCTF/CR
       #4'# *4'( #NRC-G[UJVO 5*#2' TGEV %1145 
       #4'# *4'( #TTQY-G[UJVO 5*#2' RQN[IQP
         %1145 
       #4'# *4'( 2CIG-G[UJVO 5*#2' EKTENG %1145
4QFKC      1DKGMV[ +OCIG #TGC QTC /CR 
4QFKC                 

           /#2
           /#2 0#/' NCOR/CR + NCORAOCR
           #4'# *4'( 5JCFGJVO 5*#2' RQN[IQP %1145 
           #4'# *4'( $CUGJVO 5*#2' TGEV %1145 
           #4'# *4'( %JCKPJVO 5*#2' RQN[IQP %1145 
           /#2
           (14/
           2 +0276 6;2' DWVVQP 8#.7' 9[ YKGVN QDTC NCOR[ QP%NKEM EJCPIG6Q.COR

           +0276 6;2' DWVVQP 8#.7' 9[IGPGTWL OCRú QP%NKEM OCMG#TGCU
 2
           2
           +0276 6;2' DWVVQP 8#.7' 9[ YKGVN QDTC MNCYKCVWT[
             QP%NKEM EJCPIG6Q-G[DQCTF
 2
           (14/
           $1;
           *6/.




4[UWPGM  Skrypt wygenerował specjalną mapę odnośników dostosowaną do wyświetlanego obrazu

Contenu connexe

Tendances

mod_rewrite. Podręcznik administratora
mod_rewrite. Podręcznik administratoramod_rewrite. Podręcznik administratora
mod_rewrite. Podręcznik administratoraWydawnictwo Helion
 
Po prostu JavaScript i Ajax. Wydanie VI
Po prostu JavaScript i Ajax. Wydanie VIPo prostu JavaScript i Ajax. Wydanie VI
Po prostu JavaScript i Ajax. Wydanie VIWydawnictwo Helion
 
Tworzenie stron WWW w praktyce
Tworzenie stron WWW w praktyceTworzenie stron WWW w praktyce
Tworzenie stron WWW w praktyceWydawnictwo Helion
 
Linux. Niezbędnik programisty
Linux. Niezbędnik programistyLinux. Niezbędnik programisty
Linux. Niezbędnik programistyWydawnictwo Helion
 
Zwiększ szybkość! Optymalizacja serwisów internetowych
Zwiększ szybkość! Optymalizacja serwisów internetowychZwiększ szybkość! Optymalizacja serwisów internetowych
Zwiększ szybkość! Optymalizacja serwisów internetowychWydawnictwo Helion
 
Projektowanie serwisów WWW. Standardy sieciowe
Projektowanie serwisów WWW. Standardy siecioweProjektowanie serwisów WWW. Standardy sieciowe
Projektowanie serwisów WWW. Standardy siecioweWydawnictwo Helion
 
Ajax, JavaScript i PHP. Intensywny trening
Ajax, JavaScript i PHP. Intensywny treningAjax, JavaScript i PHP. Intensywny trening
Ajax, JavaScript i PHP. Intensywny treningWydawnictwo Helion
 
Po prostu PHP. Techniki zaawansowane
Po prostu PHP. Techniki zaawansowanePo prostu PHP. Techniki zaawansowane
Po prostu PHP. Techniki zaawansowaneWydawnictwo Helion
 
Pajączek 5 NxG. Ćwiczenia praktyczne
Pajączek 5 NxG. Ćwiczenia praktycznePajączek 5 NxG. Ćwiczenia praktyczne
Pajączek 5 NxG. Ćwiczenia praktyczneWydawnictwo Helion
 
PHP i MySQL. Dynamiczne strony WWW. Szybki start. Wydanie II
PHP i MySQL. Dynamiczne strony WWW. Szybki start. Wydanie IIPHP i MySQL. Dynamiczne strony WWW. Szybki start. Wydanie II
PHP i MySQL. Dynamiczne strony WWW. Szybki start. Wydanie IIWydawnictwo Helion
 
Hack Proofing Your Web Applications. Edycja polska
Hack Proofing Your Web Applications. Edycja polskaHack Proofing Your Web Applications. Edycja polska
Hack Proofing Your Web Applications. Edycja polskaWydawnictwo Helion
 
Serwisy internetowe. Programowanie
Serwisy internetowe. ProgramowanieSerwisy internetowe. Programowanie
Serwisy internetowe. ProgramowanieWydawnictwo Helion
 

Tendances (20)

mod_rewrite. Podręcznik administratora
mod_rewrite. Podręcznik administratoramod_rewrite. Podręcznik administratora
mod_rewrite. Podręcznik administratora
 
Java. Tworzenie gier
Java. Tworzenie gierJava. Tworzenie gier
Java. Tworzenie gier
 
Po prostu JavaScript i Ajax. Wydanie VI
Po prostu JavaScript i Ajax. Wydanie VIPo prostu JavaScript i Ajax. Wydanie VI
Po prostu JavaScript i Ajax. Wydanie VI
 
Tworzenie stron WWW w praktyce
Tworzenie stron WWW w praktyceTworzenie stron WWW w praktyce
Tworzenie stron WWW w praktyce
 
JavaScript i DHTML. Receptury
JavaScript i DHTML. RecepturyJavaScript i DHTML. Receptury
JavaScript i DHTML. Receptury
 
Linux. Niezbędnik programisty
Linux. Niezbędnik programistyLinux. Niezbędnik programisty
Linux. Niezbędnik programisty
 
Java 2. Podstawy
Java 2. PodstawyJava 2. Podstawy
Java 2. Podstawy
 
Zwiększ szybkość! Optymalizacja serwisów internetowych
Zwiększ szybkość! Optymalizacja serwisów internetowychZwiększ szybkość! Optymalizacja serwisów internetowych
Zwiększ szybkość! Optymalizacja serwisów internetowych
 
PHP w mgnieniu oka
PHP w mgnieniu okaPHP w mgnieniu oka
PHP w mgnieniu oka
 
Projektowanie serwisów WWW. Standardy sieciowe
Projektowanie serwisów WWW. Standardy siecioweProjektowanie serwisów WWW. Standardy sieciowe
Projektowanie serwisów WWW. Standardy sieciowe
 
Ajax, JavaScript i PHP. Intensywny trening
Ajax, JavaScript i PHP. Intensywny treningAjax, JavaScript i PHP. Intensywny trening
Ajax, JavaScript i PHP. Intensywny trening
 
Po prostu PHP. Techniki zaawansowane
Po prostu PHP. Techniki zaawansowanePo prostu PHP. Techniki zaawansowane
Po prostu PHP. Techniki zaawansowane
 
Internet. Kurs
Internet. KursInternet. Kurs
Internet. Kurs
 
Pajączek 5 NxG. Ćwiczenia praktyczne
Pajączek 5 NxG. Ćwiczenia praktycznePajączek 5 NxG. Ćwiczenia praktyczne
Pajączek 5 NxG. Ćwiczenia praktyczne
 
PHP i MySQL. Dynamiczne strony WWW. Szybki start. Wydanie II
PHP i MySQL. Dynamiczne strony WWW. Szybki start. Wydanie IIPHP i MySQL. Dynamiczne strony WWW. Szybki start. Wydanie II
PHP i MySQL. Dynamiczne strony WWW. Szybki start. Wydanie II
 
Hack Proofing Your Web Applications. Edycja polska
Hack Proofing Your Web Applications. Edycja polskaHack Proofing Your Web Applications. Edycja polska
Hack Proofing Your Web Applications. Edycja polska
 
eXtreme programming
eXtreme programmingeXtreme programming
eXtreme programming
 
Serwisy internetowe. Programowanie
Serwisy internetowe. ProgramowanieSerwisy internetowe. Programowanie
Serwisy internetowe. Programowanie
 
Perl. Ćwiczenia
Perl. ĆwiczeniaPerl. Ćwiczenia
Perl. Ćwiczenia
 
ABC tworzenia stron WWW
ABC tworzenia stron WWWABC tworzenia stron WWW
ABC tworzenia stron WWW
 

En vedette

Pielęgniarka zawód z przyszłością sprawozdanie z pracy w ZG PTP 2005-2012
Pielęgniarka zawód z przyszłością sprawozdanie z pracy w ZG PTP 2005-2012Pielęgniarka zawód z przyszłością sprawozdanie z pracy w ZG PTP 2005-2012
Pielęgniarka zawód z przyszłością sprawozdanie z pracy w ZG PTP 2005-2012Dorota Kilańska
 
Qigong a choroba nowotworowa
Qigong  a  choroba   nowotworowaQigong  a  choroba   nowotworowa
Qigong a choroba nowotworowaLena Huppert
 
instrukcja obsługi
instrukcja obsługiinstrukcja obsługi
instrukcja obsługiWenderSAD
 
Projekt rynku mocy spotkanie konsultacyjne
Projekt rynku mocy   spotkanie konsultacyjneProjekt rynku mocy   spotkanie konsultacyjne
Projekt rynku mocy spotkanie konsultacyjneGrupa PTWP S.A.
 
REAL vs VIRTUAL - o realnych potrzebach wirtualnej rzeczywistości
REAL vs VIRTUAL - o realnych potrzebach wirtualnej rzeczywistościREAL vs VIRTUAL - o realnych potrzebach wirtualnej rzeczywistości
REAL vs VIRTUAL - o realnych potrzebach wirtualnej rzeczywistościInternetBeta
 
Innovation and its impact on the strategic management of it comapnies - Paweł...
Innovation and its impact on the strategic management of it comapnies - Paweł...Innovation and its impact on the strategic management of it comapnies - Paweł...
Innovation and its impact on the strategic management of it comapnies - Paweł...Pawel Lopatka
 
Rodzaje faktoringu oferowane przez KUKE Finance S.A.
Rodzaje faktoringu oferowane przez KUKE Finance S.A.Rodzaje faktoringu oferowane przez KUKE Finance S.A.
Rodzaje faktoringu oferowane przez KUKE Finance S.A.KUKE Finance S.A.
 
Prawo Budowlane
Prawo BudowlanePrawo Budowlane
Prawo BudowlaneAMP
 
Oszastowski przydatność utworzenia numerycznego modelu terenu (nmt) dla teren...
Oszastowski przydatność utworzenia numerycznego modelu terenu (nmt) dla teren...Oszastowski przydatność utworzenia numerycznego modelu terenu (nmt) dla teren...
Oszastowski przydatność utworzenia numerycznego modelu terenu (nmt) dla teren...Michał Oszastowski
 
Tabela 1 i 2
Tabela 1 i 2Tabela 1 i 2
Tabela 1 i 2ptwp
 
Paweł A Łączkowski: Formalne uwarunkowania modelu Open Code Transfer -- prawo...
Paweł A Łączkowski: Formalne uwarunkowania modelu Open Code Transfer -- prawo...Paweł A Łączkowski: Formalne uwarunkowania modelu Open Code Transfer -- prawo...
Paweł A Łączkowski: Formalne uwarunkowania modelu Open Code Transfer -- prawo...Pammco sp. z o.o.
 
Geografia jest git
Geografia jest gitGeografia jest git
Geografia jest gitmartucha3617
 
Elmi tədqiqatlara aparan yolda ilk addımlar
Elmi tədqiqatlara aparan yolda ilk addımlarElmi tədqiqatlara aparan yolda ilk addımlar
Elmi tədqiqatlara aparan yolda ilk addımlarshahnaz01
 
Moje Poczatki W Pp
Moje Poczatki W PpMoje Poczatki W Pp
Moje Poczatki W Ppzed.seo
 
Krystalografia
KrystalografiaKrystalografia
KrystalografiaMaja Polak
 
Future of copyright for Wikimedia Polska
Future of copyright for Wikimedia PolskaFuture of copyright for Wikimedia Polska
Future of copyright for Wikimedia PolskaJarosław Lipszyc
 
Dietetyk 321[11] o1.02_u
Dietetyk 321[11] o1.02_uDietetyk 321[11] o1.02_u
Dietetyk 321[11] o1.02_ugemix gemix
 

En vedette (20)

Pielęgniarka zawód z przyszłością sprawozdanie z pracy w ZG PTP 2005-2012
Pielęgniarka zawód z przyszłością sprawozdanie z pracy w ZG PTP 2005-2012Pielęgniarka zawód z przyszłością sprawozdanie z pracy w ZG PTP 2005-2012
Pielęgniarka zawód z przyszłością sprawozdanie z pracy w ZG PTP 2005-2012
 
Qigong a choroba nowotworowa
Qigong  a  choroba   nowotworowaQigong  a  choroba   nowotworowa
Qigong a choroba nowotworowa
 
instrukcja obsługi
instrukcja obsługiinstrukcja obsługi
instrukcja obsługi
 
Projekt rynku mocy spotkanie konsultacyjne
Projekt rynku mocy   spotkanie konsultacyjneProjekt rynku mocy   spotkanie konsultacyjne
Projekt rynku mocy spotkanie konsultacyjne
 
REAL vs VIRTUAL - o realnych potrzebach wirtualnej rzeczywistości
REAL vs VIRTUAL - o realnych potrzebach wirtualnej rzeczywistościREAL vs VIRTUAL - o realnych potrzebach wirtualnej rzeczywistości
REAL vs VIRTUAL - o realnych potrzebach wirtualnej rzeczywistości
 
Innovation and its impact on the strategic management of it comapnies - Paweł...
Innovation and its impact on the strategic management of it comapnies - Paweł...Innovation and its impact on the strategic management of it comapnies - Paweł...
Innovation and its impact on the strategic management of it comapnies - Paweł...
 
Język C. Programowanie
Język C. ProgramowanieJęzyk C. Programowanie
Język C. Programowanie
 
Rośliny
RoślinyRośliny
Rośliny
 
Rodzaje faktoringu oferowane przez KUKE Finance S.A.
Rodzaje faktoringu oferowane przez KUKE Finance S.A.Rodzaje faktoringu oferowane przez KUKE Finance S.A.
Rodzaje faktoringu oferowane przez KUKE Finance S.A.
 
Prawo Budowlane
Prawo BudowlanePrawo Budowlane
Prawo Budowlane
 
Oszastowski przydatność utworzenia numerycznego modelu terenu (nmt) dla teren...
Oszastowski przydatność utworzenia numerycznego modelu terenu (nmt) dla teren...Oszastowski przydatność utworzenia numerycznego modelu terenu (nmt) dla teren...
Oszastowski przydatność utworzenia numerycznego modelu terenu (nmt) dla teren...
 
Tabela 1 i 2
Tabela 1 i 2Tabela 1 i 2
Tabela 1 i 2
 
Ajax. Biblia
Ajax. BibliaAjax. Biblia
Ajax. Biblia
 
Paweł A Łączkowski: Formalne uwarunkowania modelu Open Code Transfer -- prawo...
Paweł A Łączkowski: Formalne uwarunkowania modelu Open Code Transfer -- prawo...Paweł A Łączkowski: Formalne uwarunkowania modelu Open Code Transfer -- prawo...
Paweł A Łączkowski: Formalne uwarunkowania modelu Open Code Transfer -- prawo...
 
Geografia jest git
Geografia jest gitGeografia jest git
Geografia jest git
 
Elmi tədqiqatlara aparan yolda ilk addımlar
Elmi tədqiqatlara aparan yolda ilk addımlarElmi tədqiqatlara aparan yolda ilk addımlar
Elmi tədqiqatlara aparan yolda ilk addımlar
 
Moje Poczatki W Pp
Moje Poczatki W PpMoje Poczatki W Pp
Moje Poczatki W Pp
 
Krystalografia
KrystalografiaKrystalografia
Krystalografia
 
Future of copyright for Wikimedia Polska
Future of copyright for Wikimedia PolskaFuture of copyright for Wikimedia Polska
Future of copyright for Wikimedia Polska
 
Dietetyk 321[11] o1.02_u
Dietetyk 321[11] o1.02_uDietetyk 321[11] o1.02_u
Dietetyk 321[11] o1.02_u
 

Similaire à JavaScript - przykłady. Biblia

JavaScript. Zaawansowane programowanie
JavaScript. Zaawansowane programowanieJavaScript. Zaawansowane programowanie
JavaScript. Zaawansowane programowanieWydawnictwo Helion
 
Adobe PageMaker 7.0. Oficjalny podręcznik
Adobe PageMaker 7.0. Oficjalny podręcznikAdobe PageMaker 7.0. Oficjalny podręcznik
Adobe PageMaker 7.0. Oficjalny podręcznikWydawnictwo Helion
 
Adobe Illustrator 10. Ćwiczenia
Adobe Illustrator 10. ĆwiczeniaAdobe Illustrator 10. Ćwiczenia
Adobe Illustrator 10. ĆwiczeniaWydawnictwo Helion
 
FrontPage 2003 PL. Nie tylko dla webmasterów
FrontPage 2003 PL. Nie tylko dla webmasterówFrontPage 2003 PL. Nie tylko dla webmasterów
FrontPage 2003 PL. Nie tylko dla webmasterówWydawnictwo Helion
 
.Net. Najpilniej strzeżone tajemnice
.Net. Najpilniej strzeżone tajemnice.Net. Najpilniej strzeżone tajemnice
.Net. Najpilniej strzeżone tajemniceWydawnictwo Helion
 
100 sposobów na Visual Studio
100 sposobów na Visual Studio100 sposobów na Visual Studio
100 sposobów na Visual StudioWydawnictwo Helion
 
Microsoft Visual Studio 2008. Księga eksperta
Microsoft Visual Studio 2008. Księga ekspertaMicrosoft Visual Studio 2008. Księga eksperta
Microsoft Visual Studio 2008. Księga ekspertaWydawnictwo Helion
 
Tworzenie stron WWW. Ilustrowany przewodnik
Tworzenie stron WWW. Ilustrowany przewodnikTworzenie stron WWW. Ilustrowany przewodnik
Tworzenie stron WWW. Ilustrowany przewodnikWydawnictwo Helion
 
Java w komercyjnych usługach sieciowych. Księga eksperta
Java w komercyjnych usługach sieciowych. Księga ekspertaJava w komercyjnych usługach sieciowych. Księga eksperta
Java w komercyjnych usługach sieciowych. Księga ekspertaWydawnictwo Helion
 

Similaire à JavaScript - przykłady. Biblia (20)

JavaScript. Zaawansowane programowanie
JavaScript. Zaawansowane programowanieJavaScript. Zaawansowane programowanie
JavaScript. Zaawansowane programowanie
 
JavaScript. Biblia
JavaScript. BibliaJavaScript. Biblia
JavaScript. Biblia
 
Dreamweaver MX
Dreamweaver MXDreamweaver MX
Dreamweaver MX
 
Adobe PageMaker 7.0. Oficjalny podręcznik
Adobe PageMaker 7.0. Oficjalny podręcznikAdobe PageMaker 7.0. Oficjalny podręcznik
Adobe PageMaker 7.0. Oficjalny podręcznik
 
Uczta programistów
Uczta programistówUczta programistów
Uczta programistów
 
Adobe Illustrator 10. Ćwiczenia
Adobe Illustrator 10. ĆwiczeniaAdobe Illustrator 10. Ćwiczenia
Adobe Illustrator 10. Ćwiczenia
 
Contribute 2. Szybki start
Contribute 2. Szybki startContribute 2. Szybki start
Contribute 2. Szybki start
 
FrontPage 2003 PL. Nie tylko dla webmasterów
FrontPage 2003 PL. Nie tylko dla webmasterówFrontPage 2003 PL. Nie tylko dla webmasterów
FrontPage 2003 PL. Nie tylko dla webmasterów
 
Po prostu Java 2
Po prostu Java 2Po prostu Java 2
Po prostu Java 2
 
Pajączek 5 NxG
Pajączek  5 NxGPajączek  5 NxG
Pajączek 5 NxG
 
Visual Basic .NET. Ćwiczenia
Visual Basic .NET. ĆwiczeniaVisual Basic .NET. Ćwiczenia
Visual Basic .NET. Ćwiczenia
 
JavaScript. Rozmówki
JavaScript. RozmówkiJavaScript. Rozmówki
JavaScript. Rozmówki
 
.Net. Najpilniej strzeżone tajemnice
.Net. Najpilniej strzeżone tajemnice.Net. Najpilniej strzeżone tajemnice
.Net. Najpilniej strzeżone tajemnice
 
100 sposobów na Visual Studio
100 sposobów na Visual Studio100 sposobów na Visual Studio
100 sposobów na Visual Studio
 
Microsoft Visual Studio 2008. Księga eksperta
Microsoft Visual Studio 2008. Księga ekspertaMicrosoft Visual Studio 2008. Księga eksperta
Microsoft Visual Studio 2008. Księga eksperta
 
C#. Ćwiczenia
C#. ĆwiczeniaC#. Ćwiczenia
C#. Ćwiczenia
 
Spring. Zapiski programisty
Spring. Zapiski programistySpring. Zapiski programisty
Spring. Zapiski programisty
 
C++ bez obaw
C++ bez obawC++ bez obaw
C++ bez obaw
 
Tworzenie stron WWW. Ilustrowany przewodnik
Tworzenie stron WWW. Ilustrowany przewodnikTworzenie stron WWW. Ilustrowany przewodnik
Tworzenie stron WWW. Ilustrowany przewodnik
 
Java w komercyjnych usługach sieciowych. Księga eksperta
Java w komercyjnych usługach sieciowych. Księga ekspertaJava w komercyjnych usługach sieciowych. Księga eksperta
Java w komercyjnych usługach sieciowych. Księga eksperta
 

Plus de Wydawnictwo Helion

Tworzenie filmów w Windows XP. Projekty
Tworzenie filmów w Windows XP. ProjektyTworzenie filmów w Windows XP. Projekty
Tworzenie filmów w Windows XP. ProjektyWydawnictwo Helion
 
Blog, więcej niż internetowy pamiętnik
Blog, więcej niż internetowy pamiętnikBlog, więcej niż internetowy pamiętnik
Blog, więcej niż internetowy pamiętnikWydawnictwo Helion
 
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktycznePozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczneWydawnictwo Helion
 
E-wizerunek. Internet jako narzędzie kreowania image'u w biznesie
E-wizerunek. Internet jako narzędzie kreowania image'u w biznesieE-wizerunek. Internet jako narzędzie kreowania image'u w biznesie
E-wizerunek. Internet jako narzędzie kreowania image'u w biznesieWydawnictwo Helion
 
Microsoft Visual C++ 2008. Tworzenie aplikacji dla Windows
Microsoft Visual C++ 2008. Tworzenie aplikacji dla WindowsMicrosoft Visual C++ 2008. Tworzenie aplikacji dla Windows
Microsoft Visual C++ 2008. Tworzenie aplikacji dla WindowsWydawnictwo Helion
 
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie IICo potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie IIWydawnictwo Helion
 
Makrofotografia. Magia szczegółu
Makrofotografia. Magia szczegółuMakrofotografia. Magia szczegółu
Makrofotografia. Magia szczegółuWydawnictwo Helion
 
Java. Efektywne programowanie. Wydanie II
Java. Efektywne programowanie. Wydanie IIJava. Efektywne programowanie. Wydanie II
Java. Efektywne programowanie. Wydanie IIWydawnictwo Helion
 
PowerPoint 2007 PL. Seria praktyk
PowerPoint 2007 PL. Seria praktykPowerPoint 2007 PL. Seria praktyk
PowerPoint 2007 PL. Seria praktykWydawnictwo Helion
 
Serwisy społecznościowe. Budowa, administracja i moderacja
Serwisy społecznościowe. Budowa, administracja i moderacjaSerwisy społecznościowe. Budowa, administracja i moderacja
Serwisy społecznościowe. Budowa, administracja i moderacjaWydawnictwo Helion
 
Serwer SQL 2008. Administracja i programowanie
Serwer SQL 2008. Administracja i programowanieSerwer SQL 2008. Administracja i programowanie
Serwer SQL 2008. Administracja i programowanieWydawnictwo Helion
 

Plus de Wydawnictwo Helion (20)

Tworzenie filmów w Windows XP. Projekty
Tworzenie filmów w Windows XP. ProjektyTworzenie filmów w Windows XP. Projekty
Tworzenie filmów w Windows XP. Projekty
 
Blog, więcej niż internetowy pamiętnik
Blog, więcej niż internetowy pamiętnikBlog, więcej niż internetowy pamiętnik
Blog, więcej niż internetowy pamiętnik
 
Access w biurze i nie tylko
Access w biurze i nie tylkoAccess w biurze i nie tylko
Access w biurze i nie tylko
 
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktycznePozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
Pozycjonowanie i optymalizacja stron WWW. Ćwiczenia praktyczne
 
E-wizerunek. Internet jako narzędzie kreowania image'u w biznesie
E-wizerunek. Internet jako narzędzie kreowania image'u w biznesieE-wizerunek. Internet jako narzędzie kreowania image'u w biznesie
E-wizerunek. Internet jako narzędzie kreowania image'u w biznesie
 
Microsoft Visual C++ 2008. Tworzenie aplikacji dla Windows
Microsoft Visual C++ 2008. Tworzenie aplikacji dla WindowsMicrosoft Visual C++ 2008. Tworzenie aplikacji dla Windows
Microsoft Visual C++ 2008. Tworzenie aplikacji dla Windows
 
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie IICo potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
Co potrafi Twój iPhone? Podręcznik użytkownika. Wydanie II
 
Makrofotografia. Magia szczegółu
Makrofotografia. Magia szczegółuMakrofotografia. Magia szczegółu
Makrofotografia. Magia szczegółu
 
Windows PowerShell. Podstawy
Windows PowerShell. PodstawyWindows PowerShell. Podstawy
Windows PowerShell. Podstawy
 
Java. Efektywne programowanie. Wydanie II
Java. Efektywne programowanie. Wydanie IIJava. Efektywne programowanie. Wydanie II
Java. Efektywne programowanie. Wydanie II
 
JavaScript. Pierwsze starcie
JavaScript. Pierwsze starcieJavaScript. Pierwsze starcie
JavaScript. Pierwsze starcie
 
PowerPoint 2007 PL. Seria praktyk
PowerPoint 2007 PL. Seria praktykPowerPoint 2007 PL. Seria praktyk
PowerPoint 2007 PL. Seria praktyk
 
Excel 2007 PL. Seria praktyk
Excel 2007 PL. Seria praktykExcel 2007 PL. Seria praktyk
Excel 2007 PL. Seria praktyk
 
Access 2007 PL. Seria praktyk
Access 2007 PL. Seria praktykAccess 2007 PL. Seria praktyk
Access 2007 PL. Seria praktyk
 
Word 2007 PL. Seria praktyk
Word 2007 PL. Seria praktykWord 2007 PL. Seria praktyk
Word 2007 PL. Seria praktyk
 
Serwisy społecznościowe. Budowa, administracja i moderacja
Serwisy społecznościowe. Budowa, administracja i moderacjaSerwisy społecznościowe. Budowa, administracja i moderacja
Serwisy społecznościowe. Budowa, administracja i moderacja
 
AutoCAD 2008 i 2008 PL
AutoCAD 2008 i 2008 PLAutoCAD 2008 i 2008 PL
AutoCAD 2008 i 2008 PL
 
Bazy danych. Pierwsze starcie
Bazy danych. Pierwsze starcieBazy danych. Pierwsze starcie
Bazy danych. Pierwsze starcie
 
Inventor. Pierwsze kroki
Inventor. Pierwsze krokiInventor. Pierwsze kroki
Inventor. Pierwsze kroki
 
Serwer SQL 2008. Administracja i programowanie
Serwer SQL 2008. Administracja i programowanieSerwer SQL 2008. Administracja i programowanie
Serwer SQL 2008. Administracja i programowanie
 

JavaScript - przykłady. Biblia

  • 1. IDZ DO PRZYK£ADOWY ROZDZIA£ SPIS TRE CI JavaScript – przyk³ady. Biblia KATALOG KSI¥¯EK Autor: Danny Goodman T³umaczenie: Piotr Rajca KATALOG ONLINE ISBN: 83-7197-671-2 Tytu³ orygina³u: JavaScript Examples Bible: ZAMÓW DRUKOWANY KATALOG The Essential Companion to JavaScript Bible Format: B5, stron: 522 TWÓJ KOSZYK DODAJ DO KOSZYKA Niniejsza ksi¹¿ka stanowi wspania³e uzupe³nienie JavaScript. Biblia Ksi¹¿ka — autora bestsellera „JavaScript. Biblia” — to dziesi¹tki gotowych przyk³adów kodu, których mo¿esz u¿yæ na swoich stronach internetowych. Nawet je li CENNIK I INFORMACJE przedstawionych przyk³adów nie wykorzystasz bezpo rednio, to zaznajomienie siê z nimi pomo¿e Ci poznaæ tajniki JavaScriptu. Mo¿esz je porównaæ ze swoimi skryptami. ZAMÓW INFORMACJE Ogromna wiedza i umiejêtno ci Danny'ego Goodmana mog¹ byæ dla Ciebie wspania³ym O NOWO CIACH punktem odniesienia. Dodatkowo zapoznaæ siê mo¿esz z jego warto ciowymi wskazówkami i uwagami towarzysz¹cymi fragmentom kodu. ZAMÓW CENNIK Je li chcesz wzbogaciæ swoje strony o interaktywne elementy utworzone w JavaScripcie, powiniene mieæ tê ksi¹¿kê zawsze pod rêk¹. Oszczêdzisz sobie w ten sposób wiele cennego czasu. CZYTELNIA FRAGMENTY KSI¥¯EK ONLINE Wydawnictwo Helion ul. Chopina 6 44-100 Gliwice tel. (32)230-98-63 e-mail: helion@helion.pl
  • 2. 5RKU VTG EK 1 #WVQTG 9UVúR 4QFKC 1DKGMV[ QIÎNP[EJ GNGOGPVÎY *6/. 4QFKC Najwa niejsze informacje o przykładach ..............................................................................................15 Obiekty ogólne ......................................................................................................................................17 Właściwości ....................................................................................................................................17 Metody ............................................................................................................................................63 Procedury obsługi zdarzeń ............................................................................................................107 4QFKC 1DKGMV[ YKPFQY QTC HTCOG 4QFKC Informacje o przykładach ....................................................................................................................138 Obiekt window ....................................................................................................................................139 Właściwości ..................................................................................................................................139 Metody ..........................................................................................................................................162 Procedury obsługi zdarzeń ............................................................................................................196 Obiekt elementu FRAME....................................................................................................................198 Właściwości ..................................................................................................................................198 Obiekt elementu FRAMESET.............................................................................................................202 Właściwości ..................................................................................................................................202 Obiekt elementu IFRAME...................................................................................................................206 Właściwości ..................................................................................................................................206 Obiekt popup .......................................................................................................................................209 Właściwości ..................................................................................................................................209 Metody ..........................................................................................................................................210 4QFKC 1DKGMV[ NQECVKQP K JKUVQT[ 4QFKC Informacje o przykładach ....................................................................................................................213 Obiekt location ....................................................................................................................................214 Właściwości ..................................................................................................................................214 Metody ..........................................................................................................................................224 Obiekt history ......................................................................................................................................226 Właściwości ..................................................................................................................................226 Metody ..........................................................................................................................................226 4QFKC 1DKGMV[ FQEWOGPV QTC DQF[ 4QFKC Informacje o przykładach ....................................................................................................................232 Obiekt document..................................................................................................................................232
  • 3. ,CXC5ETKRV RT[M CF[ $KDNKC Właściwości ..................................................................................................................................232 Metody ..........................................................................................................................................249 Procedury obsługi zdarzeń ............................................................................................................262 Obiekt elementu BODY ......................................................................................................................263 Właściwości ..................................................................................................................................263 Metody ..........................................................................................................................................267 Procedury obsługi zdarzeń ............................................................................................................267 4QFKC 1DKGMV[ GNGOGPVÎY VGMUVQY[EJ 4QFKC Informacje o przykładach ....................................................................................................................270 Obiekt elementu FONT .......................................................................................................................270 Właściwości ..................................................................................................................................270 Obiekt elementu HR ............................................................................................................................273 Właściwości ..................................................................................................................................273 Obiekt elementu MARQUEE..............................................................................................................277 Właściwości ..................................................................................................................................277 Metody ..........................................................................................................................................279 Obiekt Range .......................................................................................................................................280 Właściwości ..................................................................................................................................280 Metody ..........................................................................................................................................282 Obiekt selection ...................................................................................................................................295 Właściwości ..................................................................................................................................295 Metody ..........................................................................................................................................296 Obiekty Text oraz TextNode ...............................................................................................................297 Właściwości ..................................................................................................................................297 Metody ..........................................................................................................................................297 Obiekt TextRange................................................................................................................................301 Właściwości ..................................................................................................................................301 Metody ..........................................................................................................................................304 Obiekt TextRectangle ..........................................................................................................................319 Właściwości ..................................................................................................................................319 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC Informacje o przykładach ....................................................................................................................323 Obiekt Image oraz obiekt elementu IMG ............................................................................................324 Właściwości ..................................................................................................................................324 Procedury obsługi zdarzeń ............................................................................................................335 Obiekt elementu AREA.......................................................................................................................336 Właściwości ..................................................................................................................................336 Obiekt elementu MAP .........................................................................................................................337 Właściwość....................................................................................................................................337 4QFKC 1DKGMV HQTO QTC QDKGMV[ PKO YKæCPG 4QFKC Informacje o przykładach ....................................................................................................................342 Obiekt FORM ......................................................................................................................................342 Właściwości ..................................................................................................................................342 Metody ..........................................................................................................................................345 Procedury obsługi zdarzeń ............................................................................................................346 Obiekt elementu LABEL.....................................................................................................................347 Właściwości ..................................................................................................................................347 4QFKC 1DKGMV DWVVQP 4QFKC Informacje o przykładach ....................................................................................................................350 Obiekt elementu BUTTON oraz obiekty Button, Submit i Reset .......................................................350
  • 4. 5RKU VTG EK Właściwości ..................................................................................................................................350 Metody ..........................................................................................................................................351 Procedury obsługi zdarzeń ............................................................................................................352 Obiekt checkbox ..................................................................................................................................353 Właściwości ..................................................................................................................................353 Procedury obsługi zdarzeń ............................................................................................................355 Obiekt radio .........................................................................................................................................358 Właściwości ..................................................................................................................................358 Procedury obsługi zdarzeń ............................................................................................................360 4QFKC 1DKGMV[ VGMUVQY[EJ GNGOGPVÎY HQTOWNCT[ 4QFKC Informacje o przykładach ....................................................................................................................364 Obiekt pola tekstowego .......................................................................................................................364 Właściwości ..................................................................................................................................364 Metody ..........................................................................................................................................369 Procedury obsługi zdarzeń ............................................................................................................371 Obiekt elementu TEXTAREA.............................................................................................................374 Właściwości ..................................................................................................................................374 Metody ..........................................................................................................................................374 4QFKC 1DKGMV[ UGNGEV QRVKQP QTC (KNG7RNQCF 4QFKC Informacje o przykładach ....................................................................................................................376 Obiekt elementu SELECT ...................................................................................................................376 Właściwości ..................................................................................................................................376 Metody ..........................................................................................................................................382 Procedury obsługi zdarzeń ............................................................................................................382 Obiekt elementu OPTION ...................................................................................................................384 Właściwości ..................................................................................................................................384 Obiekt elementu OPTGROUP.............................................................................................................384 Właściwości ..................................................................................................................................384 4QFKC 1DKGMV[ VCDGN K NKUV 4QFKC Informacje o przykładach ....................................................................................................................388 Obiekt elementu TABLE.....................................................................................................................388 Właściwości ..................................................................................................................................388 Metody ..........................................................................................................................................396 Obiekty elementów TBODY, TFOOT oraz THEAD..........................................................................397 Właściwości ..................................................................................................................................397 Obiekty elementów COL oraz COLGROUP ......................................................................................397 Właściwości ..................................................................................................................................397 Obiekt elementu TR.............................................................................................................................398 Właściwości ..................................................................................................................................398 Obiekty elementów TD oraz TH .........................................................................................................399 Właściwości ..................................................................................................................................399 Obiekt elementu OL ............................................................................................................................401 Właściwości ..................................................................................................................................401 Obiekt elementu UL ............................................................................................................................402 Właściwości ..................................................................................................................................402 Obiekt elementu LI..............................................................................................................................402 Właściwości ..................................................................................................................................402
  • 5. ,CXC5ETKRV RT[M CF[ $KDNKC 4QFKC 1DKGMV PCXKICVQT QTC KPPG QDKGMV[ TQFQYKUMQYG 4QFKC Informacje o przykładach ....................................................................................................................404 Obiekt clientInformation (IE 4+) oraz navigator (wszystkie przeglądarki) ........................................404 Właściwości ..................................................................................................................................404 Metody ..........................................................................................................................................411 Obiekt screen .......................................................................................................................................412 Właściwości ..................................................................................................................................412 Obiekt userProfile................................................................................................................................413 Metody ..........................................................................................................................................413 4QFKC 1DKGMV[ FCTG 4QFKC Informacje o przykładach ....................................................................................................................416 Obiekt event (NN 4) ............................................................................................................................417 Właściwości ..................................................................................................................................417 Obiekt event (IE 4+) ............................................................................................................................420 Właściwości ..................................................................................................................................420 Obiekt event (NN 6+) ..........................................................................................................................429 4QFKC 1DKGMV[ UV[NÎY K CTMWU[ UV[NÎY 4QFKC Informacje o przykładach ....................................................................................................................441 Obiekt styleSheet.................................................................................................................................442 Właściwości ..................................................................................................................................442 Metody ..........................................................................................................................................444 Obiekty cssRule oraz rule....................................................................................................................446 Właściwości ..................................................................................................................................446 4QFKC 1DKGMV[ WOKGLUEQYKQPG 4QFKC Informacje o przykładach ....................................................................................................................450 Obiekt layer stosowany w przeglądarce NN 4 ......................................................................................450 Właściwości ..................................................................................................................................450 Metody ..........................................................................................................................................469 4QFKC 1DKGMV[ 5VTKPI /CVJ 0WODGT K $QQNGCP 4QFKC [ K Informacje o przykładach ....................................................................................................................476 Obiekt String........................................................................................................................................476 Właściwości ..................................................................................................................................476 Metody rozbioru łańcuchów..........................................................................................................477 Obiekt Number ....................................................................................................................................489 Właściwości ..................................................................................................................................489 Metody ..........................................................................................................................................490 4QFKC 1DKGMV #TTC[ 4QFKC Informacje o przykładach ....................................................................................................................492 Metody obiektu Array .........................................................................................................................492 5MQTQYKF
  • 6. 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC 9 V[O TQFKCNG Jak pobierać obrazy do pamięci podręcznej i zamieniać obrazy wyświetlane na stronie Wykonywanie czynności bezpośrednio po pobraniu obrazu Tworzenie interaktywnych map odnośników obsługiwanych po stronie klienta Obiekty elementów +/) są bardzo często wykorzystywane w skryptach, głównie dlatego, i są one stosowane w rozwiązaniach polegających na zamienianiu obrazów wyświetla- nych na stronie. Poza tym mo liwość wykorzystania tych obiektów w skryptach była dostępna niemal ju w pierwszych wersjach przeglądarek obsługujących język Java- Script. W rozwiązaniach obejmujących zamienianie obrazów pomocniczą rolę odgrywa obiekt +OCIG, wykorzystywany w celu pobrania obrazu z serwera od pamięci podręcznej przeglądarki (dzięki czemu obraz wyświetlony na stronie mo na błyskawicznie zamie- nić na inny). Choć z punktu widzenia skryptów te obiekty są ró ne, mają wiele wspól- nych właściwości i metod, dzięki czemu poznanie sposobów ich wykorzystania jest znacznie prostsze. Obiekty elementów #4'# oraz /#2 ściśle ze sobą współpracują. W praktyce element #4'# przypomina nieco obiekt # u ywany do definiowania połączeń. Oba elementy tworzą bowiem na stronie „miejsca”, które u ytkownik mo e kliknąć, co zazwyczaj powoduje przejście na inną stronę witryny lub do dowolnego innego miejsca Sieci. Te obiekty mają tak e wiele wspólnych właściwości związanych z adresami URL. +PHQTOCELG Q RT[M CFCEJ Większość wersji przeglądarki Internet Explorer jest w stanie wyświetlać elementy +/) zawierające zarówno obrazy nieruchome, jak i „ruchome” (na przykład, klipy wideo zapisane w formacie MPEG). Przykład przedstawiony na listingu 22.3 pokazuje w jaki sposób, przy u yciu właściwości F[PUTE, mo na zastąpić obraz stały obrazem ruchomym.
  • 7. ,CXC5ETKRV RT[M CF[ $KDNKC Strona przedstawiona na listingu 22.4 pozwala na porównanie efektywności zamieniania obrazów przechowywanych w pamięci podręcznej przeglądarki i pobieranych bezpośrednio z serwera. Skrypt pokazuje tak e w jaki sposób mo na cyklicznie zamieniać obrazy w określonych odstępach czasu. Listing 22.5 pokazuje w jaki sposób mo na wykonywać czynności w odpowiedzi na zdarzenie QP.QCF obrazu. Na listingu 22.7 został przedstawiony skrypt o bardzo du ych mo liwościach, pokazujący w jaki sposób, po zmianie obrazu wyświetlanego w elemencie +/), mo na zastosować nową mapę odnośników obsługiwaną po stronie przeglądarki. 1DKGMV +OCIG QTC QDKGMV GNGOGPVW +/) 9 C EKYQ EK CNKIP NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Strona przedstawiona na listingu 22.1 pozwala na przypisywanie ró nych wartości właści- wości CNKIP, określającej poło enie wewnątrzwierszowego obrazu w stosunku do sąsia- dującego z nim tekstu. Spróbuj zmieniać wielkość okna przeglądarki, aby tekst wyświe- tlany na stronie był w ró ny sposób dzielony i przyjrzyj się, jaki wpływ na układ strony mają wybierane wartości wyrównania obrazu. Nie wszystkie przeglądarki udostępniają unikatowe mo liwości wyrównania odpowiadające wszystkim podanym opcjom, a zatem spróbuj przetestować stronę w wielu ró nych przeglądarkach. .KUVKPI Testowanie właściwości align obrazów *6/. *'# 6+6.' 9 C EKYQ è CNKIP QDKGMVW +/)6+6.' 5%4+26 .#0)7#)' ,CXC5ETKRV HWPEVKQP UGV#NKIPOGPV UGN ] FQEWOGPVO[+/)CNKIP UGNQRVKQPU=UGNUGNGEVGF+PFGZ?VGZV _ 5%4+26 *'# $1; * 9 C EKYQ è CNKIP QDKGMVW +/)* *4 (14/ 9[DKGT URQUÎD Y[TÎYPCPKC 5'.'%6 QP%JCPIG UGV#NKIPOGPV VJKU
  • 8. 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC 126+10 CDUDQVVQO 126+10 CDUOKFFNG 126+10 DCUGNKPG 126+10 5'.'%6' DQVVQO 126+10 NGHV 126+10 OKFFNG 126+10 TKIJV 126+10 VGZVVQR 126+10 VQR 5'.'%6 (14/ *4 2 .QTGO KRUWO FQNQT UKV COGV EQPUGEVGVCWT CFKRKUKEKPI GNKV UGF FQ GKWUOQF VGORQT KPEKFKFWPV WV NCDQTG GV FQNQTG OCIPC CNKSWC +/) 0#/' O[+/) 54% FGUMIKH *'+)*6 9+6* 7V GPKO CFOKPKO XGPKCO SWKU PQUVTWF GZGTEKVCVKQP WNNCOEQ NCDQTKU PKUK WV CNKSWKR GZ GC EQOOQFQ EQPUGSWCV2 $1; *6/. CNV NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Określanie wartości właściwości CNV obrazów mo na wypróbować na stronie Tester (przed- stawionej w rozdziale 13. ksią ki „JavaScript. Biblia”). Celem tego przykładu jest przypisa- nie łańcucha znaków właściwości CNV obiektu FQEWOGPVO[+/). Rozpocznij od usunięcia obrazu wyświetlonego na stronie; w tym celu właściwości UTE przypisz nazwę nieist- niejącego pliku: FQEWOGPVO[+/)UTE DTCMAVGIQARNKMWIKH Jeśli przewiniesz stronę, zobaczysz na niej puste miejsce po obrazie. Teraz określ wartość właściwości UTE: FQEWOGPVO[+/)CNV $WKC (TGFC Przewiń zawartość strony, aby przekonać się czy alternatywny tekst został wyświetlony. Jeśli w łańcuchu znaków zapisywanym we właściwości CNV chcesz umieścić apostrof bądź cudzysłów (lub jeden z kilku innych znaków, które w języku JavaScript mają spe- cjalne znaczenie), to musisz poprzedzić go znakiem odwrotnego ukośnika. DQTFGT NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność
  • 9. ,CXC5ETKRV RT[M CF[ $KDNKC 2T[M CF Skutki określania wartości właściwości DQTFGT obrazów mo emy wypróbować na stronie Tester (posługując się zdefiniowanym na niej obrazem FQEWOGPVO[+/)). Przeprowadzając testy, przypisuj tej właściwości liczby całkowite o ró nej wartości. EQORNGVG NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Przed otwarciem strony z listingu 22.2 prezentującej zastosowanie właściwości KOCIG EQORNGVG, zamknij i ponownie otwórz przeglądarkę (w ten sposób będziesz miał pew- ność, e adne obrazy nie znajdują się w jej pamięci podręcznej). Podczas pobierania ka dego z obrazów sprawdzaj stan właściwości EQORNGVG obiektu KOCIG — klikaj w tym celu przycisk Czy obraz ju pobrano. Do momentu zakończenia pobierania obrazu wła- ściwość ta będzie mieć wartość HCNUG, potem przyjmie wartość VTWG. Na naszej przykła- dowej stronie u ywane są dwa obrazy, przy czym obraz prezentujący łuk skalny jest większy. Być mo e pomiędzy kolejnymi próbami będziesz musiał zamykać i ponownie otwierać przeglądarkę, aby usunąć obraz z pamięci podręcznej (lub opró nić całą pamięć podręczną przeglądarki). Jeśli wykorzystanie właściwości EQORNGVG we własnych skryptach będzie Ci przysparzać problemów, to spróbuj zdefiniować procedurę obsługi zdarzeń QP.QCF w znaczniku +/) (podobnie jak na listingu 22.2, mo e to być zupełnie pusta procedura obsługi zdarzeń). .KUVKPI Skrypt wykorzystujący właściwość image.complete *6/. *'# 5%4+26 .#0)7#)' ,CXC5ETKRV HWPEVKQP NQCF+V VJG+OCIGHQTO ] HQTOTGUWNVXCNWG FQEWOGPVKOCIGU=?UTE VJG+OCIG _ HWPEVKQP EJGEM.QCF HQTO ] HQTOTGUWNVXCNWG FQEWOGPVKOCIGU=?EQORNGVG _ 5%4+26 *'# $1; +/) 54% ERWIKH 9+6* *'+)*6 QP.QCF (14/ +0276 6;2' DWVVQP 8#.7' 9[ YKGVN MNCYKCVWTú QP%NKEM NQCF+V ERWIKH VJKUHQTO +0276 6;2' DWVVQP 8#.7' 9[ YKGVN FLúEKG WMW UMCNPGIQ QP%NKEM NQCF+V CTEJIKH VJKUHQTO 2 +0276 6;2' DWVVQP 8#.7' %[ QDTC LW RQDTCPQ QP%NKEM EJGEM.QCF VJKUHQTO +0276 6;2' VGZV 0#/' TGUWNV
  • 10. 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC (14/ $1; *6/. F[PUTE NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Aby w obiekcie +/) wyświetlać obrazy nieruchome bądź ruchome, wystarczy odpowiednio określać wartości właściwości UTE oraz F[PUTE — zapisywać nazwę pliku obrazu w jednej z nich, a pusty łańcuch znaków w drugiej. Bardzo prosty przykład, wyświetlający na przemian jeden obraz stały oraz jeden klip wideo, został przedstawiony na listingu 22.3. Przedstawiony przykład demonstruje poprawny sposób zamieniania obrazów nierucho- mych na ruchome (i na odwrót), umo liwiający uniknięcie błędów najczęściej popeł- nianych w takich sytuacjach (opisanych w tekście ksią ki). .KUVKPI Naprzemienne wyświetlanie obrazu nieruchomego i ruchomego *6/. *'# 6+6.' 9 C EKYQ è F[PUTE QDKGMVW +/)6+6.' 5%4+26 .#0)7#)' ,CXC5ETKRV XCT VTCKP+OI PGY +OCIG VTCKP+OIUTE COVTCMLRI VTCKP+OIF[PUTE COVTCMORI HWPEVKQP UGV.QQR ] XCT UGNGEVQT FQEWOGPVHQTOU=?NQQRGT FQEWOGPVO[+/)NQQR UGNGEVQTQRVKQPU=UGNGEVQTUGNGEVGF+PFGZ?XCNWG _ HWPEVKQP UGV+OCIG V[RG ] KH V[RG LRI ] FQEWOGPVO[+/)F[PUTE FQEWOGPVO[+/)UTE VTCKP+OIUTE _ GNUG ] FQEWOGPVO[+/)UTE FQEWOGPVO[+/)UVCTV HKNGQRGP UGV.QQR FQEWOGPVO[+/)F[PUTE VTCKP+OIF[PUTE _ _ 5%4+26 *'# $1; * 9 C EKYQ è F[PUTE QDKGMVW +/)* *4 (14/ 9[DKGT V[R QDTCW
  • 11. ,CXC5ETKRV RT[M CF[ $KDNKC +0276 6;2' TCFKQ 0#/' KOI)TQWR %*'%-' QP%NKEM UGV+OCIG LRI 0KGTWEJQO[ +0276 6;2' TCFKQ 0#/' KOI)TQWR QP%NKEM UGV+OCIG ORI 9KFGQ 2 +NG TC[ QFVYQT[è MNKR YKFGQ RQ RQDTCPKW 5'.'%6 0#/' NQQRGT QP%JCPIG UGV.QQR 126+10 8#.7' 5'.'%6' TC 126+10 8#.7' FYC TC[ 126+10 8#.7' Y PKGUMQ EQPQ è 5'.'%6 2 (14/ *4 +/) 0#/' O[+/) 54% COVTCMLRI *'+)*6 9+6* $1; *6/. Jeśli skrypt jawnie nie przypisze właściwości UVCTV wartości HKNGQRGP (jak w powy - szym przykładzie), to aby odtworzyć klip, u ytkownicy przeglądarek Internet Explorer dla komputerów Macintosh będą musieli kliknąć go dwa razy (IE 4) lub raz (IE 5). HKNG%TGCVGFCVG HKNG/QFKHKGFCVG HKNG5KG NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Wszystkie trzy omawiane tu właściwości są podobne od analogicznych właściwości obiektu FQEWOGPV. Przykład ich wykorzystania został przedstawiony na listingu 18.4. Jeśli chcesz wypróbować omawiane właściwości obiektu obrazu, to skopiuj stronę przedsta- wioną na listingu 18.4, dodaj do niej element +/), a następnie zastąp odwołania do wła- ściwości obiektu FQEWOGPV odwołaniami do odpowiedniego obiektu elementu +/). JGKIJV YKFVJ NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Właściwości JGKIJV oraz YKFVJ mo na wypróbować na stronie Tester (przedstawionej w rozdziale 13. ksią ki „JavaScript. Biblia”). Zacznij od pobrania domyślnych wartości tych właściwości. W tym celu w górnym polu tekstowym formularza wpisz następujące wyra enia: FQEWOGPVO[+/)JGKIJV FQEWOGPVO[+/)YKFVJ
  • 12. 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC Następnie zmień wysokość obrazu z 90 do 180 pikseli: FQEWOGPVO[+/)JGKIJV Gdy przewiniesz stronę i wyświetlisz obraz, oka e się, e został on przeskalowany (aby zachować oryginalne proporcje). W końcu podaj nową szerokość obrazu: FQEWOGPVO[+/)YKFVJ i przyjrzyj się efektom wprowadzonych modyfikacji. JURCEG XURCEG NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Do sprawdzenia właściwości JURCEG i XURCEG mo na u yć strony Tester (opisanej w roz- dziale 13. ksią ki „JavaScript. Biblia”). W pierwszej kolejności upewnij się, e obraz wy- świetlony na samym końcu strony nie ma adnych marginesów i jest wyświetlony tu przy lewej krawędzi okna przeglądarki. Następnie zmień szerokość poziomego margi- nesu na 30 pikseli: FQEWOGPVO[+/)JURCEG Wykonanie powy szej instrukcji spowoduje odsunięcie obrazu od lewej krawędzi strony na odległość 30 pikseli. Margines o tej samej szerokości został umieszczony tak e z prawej strony obrazu, choć nie jest on widoczny na stronie. KU/CR NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Obraz wyświetlony u dołu strony Tester nie został zdefiniowany jako mapa odnośników. Z tego względu, jeśli w górnym polu tekstowym formularza wyświetlonego na tej stronie wpiszesz poni sze wyra enie i klikniesz przycisk Oblicz, to w polu poni ej zostanie wyświetlona wartość HCNUG: FQEWOGPVO[+/)KU/CR NQQR NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność
  • 13. ,CXC5ETKRV RT[M CF[ $KDNKC 2T[M CF Przykład wykorzystania właściwości NQQR został przedstawiony na listingu 22.3, zamiesz- czonym w opisie właściwości F[PUTE. NQYUTE NQY5TE NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Wpływ właściwości określających plik źródłowy obrazu na przetwarzanie zdarzeń został przedstawiony na listingu 22.5, podanym w opisie procedury obsługi zdarzeń QP.QCF. PCOG NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność ( ) 2T[M CF Do sprawdzenia wartości właściwości PCOG mo na wykorzystać stronę Tester (przedsta- wioną w rozdziale 13. ksią ki „JavaScript. Biblia”). W górnym polu tekstowym formu- larza wpisz następujące wyra enie: FQEWOGPVO[+/)PCOG Oczywiście, powy szy przykład jest nieco bezsensowny, gdy nazwa obrazu stanowi fragment u ytego odwołania. PCOG2TQR NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Do porównania wartości właściwości UTE i PCOG2TQR w przeglądarce IE 5+ dla systemu Windows mo na u yć strony Tester (przedstawionej w rozdziale 13. ksią ki „JavaScript. Biblia”). W górnym polu tekstowym formularza wpisz ka de z poni szych wyra eń: FQEWOGPVO[+/)UTE FQEWOGPVO[+/)PCOG2TQR
  • 14. 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC RTQVQEQN NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Do sprawdzenia wartości właściwości RTQVQEQN obiektu reprezentującego obraz mo na u yć strony Tester. W górnym polu tekstowym formularza wpisz poni sze wyra enie: FQEWOGPVO[+/)RTQVQEQN UTE NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność ( ) 2T[M CF W przykładzie przedstawionym na listingu 22.4 pokazanych zostało kilka ró nych zasto- sowań obiektów reprezentujących obrazy. Podstawowym celem tego przykładu jest przed- stawienie ró nic w efektywności zamieniania obrazów przechowywanych w pamięci podręcznej przeglądarki oraz pobieranych bezpośrednio z serwera. Dodatkowo skrypt pokazuje w jaki sposób automatycznie zamieniać wyświetlane obrazy w podanych odstę- pach czasu. Rozwiązanie to jest bardzo często stosowane na witrynach wyświetlających paski z reklamami. W momencie pobierania strony, w zmiennej globalnej zapisywana jest tablica obiektów +OCIG. Poszczególne komórki tej tablicy są indeksowane łańcuchami znaków reprezen- tującymi nazwy obrazów (na przykład: FGUM , FGUM i tak dalej). Rozwiązanie to zo- stało wykorzystane celowo, gdy skrypt będzie się odwoływał do poszczególnych komórek tablicy właśnie przy u yciu tych nazw. Ka demu obiektowi +OCIG zapisanemu w tablicy zostaje przypisany adres URL obrazu. Dzięki temu obrazy zostają pobrane i zapisane w pamięci podręcznej przeglądarki. Na stronie zostały zdefiniowane dwa elementy +/) (patrz rysunek 6.1). Pierwszy z nich wyświetla obrazy pobierane bezpośrednio z serwera, a drugi — obrazy pobierane z pa- mięci podręcznej. Poni ej ka dego z elementów +/) zostaje wyświetlona rozwijana lista pozwalająca na wybranie jednego z czterech obrazów, który ma zostać wyświetlony w danym elemencie +/). W procedurach obsługi zdarzeń QP%JCPIG elementów 5'.'%6 wywoływane są dwie ró ne funkcje — w przypadku obrazów pobieranych z serwera wywoływana jest funkcja NQCF+PFKXKFWCN , a w przypadku obrazów pobieranych z pa- mięci podręcznej — funkcja NQCF%CEJGF . W wywołaniach obu funkcji podawany jest jeden argument — odwołanie do formularza zawierającego elementy 5'.'%6. Za cykliczną zmianę obrazów co 5 sekund odpowiada funkcja EJGEM6KOGT , która w pierw- szej kolejności sprawdza czy jest zaznaczone odpowiednie pole wyboru. Jeśli pole zostało
  • 15. ,CXC5ETKRV RT[M CF[ $KDNKC 4[UWPGM Strona demonstrująca wykorzystanie obiektów Image (Obrazy © Aris Multimedia Inc., 1994) zaznaczone, to funkcja pobiera wartość właściwości UGNGEVGF+PFGZ listy słu ącej do wyboru obrazu pobieranego z pamięci podręcznej. Następnie wartość ta jest inkrementowana (lub zmniejszana do zera, jeśli przekroczyła pewną maksymalną wartość), a odpowied- nia lista zostaje zaktualizowana. Po wykonaniu powy szych czynności skrypt mo e ju wywołać funkcję NQCF%CEJGF , która określa wybrany element listy i wyświetla odpo- wiedni obraz. Dodatkowo, w znaczniku $1; została zdefiniowana procedura obsługi zdarzenia QP7P NQCF, która wywołuje funkcję TGUGV5GNGEVU . Ta ogólna funkcja przegląda wszystkie formularze zdefiniowane na stronie i odnajduje w nich wszystkie elementy 5'.'%6. W ka dym z odnalezionych elementów, funkcja przypisuje właściwości UGNGEVGF+PFGZ wartość . Dzięki temu, jeśli u ytkownik odświe y stronę lub wróci na nią w wyniku kliknięcia przycisku Wstecz (Back), to obrazy będą odtwarzane w oryginalnej kolejności. Procedura obsługi zdarzenia QP.QCF zapewnia, e wyświetlane obrazy będą odpowiadać opcjom wybranym na odpowiadającym im listach, a po 5 sekundach zostanie wywołana funkcja EJGEM6KOGT . Nale y jednak zwrócić uwagę, i obrazy pobierane z pamięci podręcznej przeglądarki są zamieniane wyłącznie wówczas, gdy u ytkownik zaznaczy pole wyboru wyświetlone u dołu strony. .KUVKPI Obsługa obiektu image za pomocą skryptu i zamienianie obrazów *6/. *'# 6+6.' 1DKGM +OCIG6+6.'
  • 16. 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC 5%4+26 .#0)7#)' ,CXC5ETKRV INQDCNPG FGMNCTCELG VCDNKE[ QDTCÎY XCT KOCIG$ QDTC[ RTGEJQY[YCPG Y RCOKúEK RQFTúEPGL KH FQEWOGPVKOCIGU ] FNC Y[IQF[ CRKUWLGO[ VGMUVQYG KPFGMU[ VCDNKE[ Y HQTOKG NKUV[ XCT FGUM+OCIGU PGY #TTC[ FGUM FGUM FGUM FGUM VYQT[O[ VCDNKEú QDKGMVÎY +OCIG K RQDKGTCO[ QDTC[ FQ RCOKúEK RQFTúEPGL KOCIG$ PGY #TTC[ HQT XCT K K KOCIG$NGPIVJ K ] KOCIG$=FGUM+OCIGU=K?? PGY +OCIG KOCIG$=FGUM+OCIGU=K??UTE FGUM+OCIGU=K? IKH _ _ OKGPKCO[ QDTC RQDKGTCP[ DGRQ TGFPKQ UGTYGTC HWPEVKQP NQCF+PFKXKFWCN HQTO ] KH FQEWOGPVKOCIGU ] XCT IKH0COG HQTOKPFKXKFWCNQRVKQPU=HQTOKPFKXKFWCNUGNGEVGF+PFGZ?XCNWG FQEWOGPVVJWODPCKNUTE IKH0COG IKH _ _ OKGPKCO[ QDTC RTGEJQY[YCP[ Y RCOKúEK RQFTúEPGL HWPEVKQP NQCF%CEJGF HQTO ] KH FQEWOGPVKOCIGU ] XCT IKH+PFGZ HQTOECEJGFQRVKQPU=HQTOECEJGFUGNGEVGF+PFGZ?XCNWG FQEWOGPVVJWODPCKNUTE KOCIG$=IKH+PFGZ?UTE _ _ LG NK RQNG Y[DQTW QUVC Q CPCEQPG VQ RQDKGTCO[ MQNGLP[ QDTC RTGEJQY[YCP[ Y RCOKúEK RQFTúEPGL HWPEVKQP EJGEM6KOGT ] KH FQEWOGPVKOCIGU FQEWOGPV6KOGTVKOGT$QZEJGEMGF ] XCT IKH+PFGZ FQEWOGPVUGNGEVKQPUECEJGFUGNGEVGF+PFGZ KH IKH+PFGZ KOCIG$NGPIVJ ] IKH+PFGZ _ FQEWOGPVUGNGEVKQPUECEJGFUGNGEVGF+PFGZ IKH+PFGZ NQCF%CEJGF FQEWOGPVUGNGEVKQPU XCT VKOGQWV+ UGV6KOGQWV EJGEM6KOGT _ _ RQFECU WUWYCPKC UVTQP[ RTGINæFCTMK QFVYCTCO[ QT[IKPCNP[ UVCP NKUV TQYKLCP[EJ HWPEVKQP TGUGV5GNGEVU ] HQT XCT K K FQEWOGPVHQTOUNGPIVJ K ] HQT XCT L L FQEWOGPVHQTOU=K?GNGOGPVUNGPIVJ L ] KH FQEWOGPVHQTOU=K?GNGOGPVU=L?V[RG UGNGEVQPG ] FQEWOGPVHQTOU=K?GNGOGPVU=L?UGNGEVGF+PFGZ _ _ _ _ KPKELWLGO[ FKC CPKG UMT[RVW
  • 17. ,CXC5ETKRV RT[M CF[ $KDNKC HWPEVKQP KPKV ] NQCF+PFKXKFWCN FQEWOGPVUGNGEVKQPU NQCF%CEJGF FQEWOGPVUGNGEVKQPU UGV6KOGQWV EJGEM6KOGT _ 5%4+26 *'# $1; QP.QCF KPKV QP7PNQCF TGUGV5GNGEVU * 1DKGMV +OCIG* *4 %'06'4 6#$.' $14'4 %'..2#+0) 64 6* 6* 6* $GRQ TGFPKQ UGTYGTC6* 6* RCOKúEK RQFTúEPGL6* 64 64 6 #.+)04+)*6 $ 1DTC$ 6 6 +/) 54% ERWIKH 0#/' VJWODPCKN *'+)*6 9+6* 6 6 +/) 54% FGUMIKH 0#/' VJWODPCKN *'+)*6 9+6* 6 64 64 6 #.+)04+)*6 $ 9[DKGT QDTC$ 6 (14/ 0#/' UGNGEVKQPU 6 5'.'%6 0#/' KPFKXKFWCN QP%JCPIG NQCF+PFKXKFWCN VJKUHQTO 126+10 8#.7' ERW TWV[ 126+10 8#.7' ERW -NCYKCVWTC 126+10 8#.7' ERW [UMKGVMK 126+10 8#.7' ERW -CDNG 5'.'%6 6 6 5'.'%6 0#/' ECEJGF QP%JCPIG NQCF%CEJGF VJKUHQTO 126+10 8#.7' FGUM )WOMK 126+10 8#.7' FGUM 5RKPCEG 126+10 8#.7' FGUM .CORC 126+10 8#.7' FGUM )WOMK 5'.'%6 6 (14/ 64 6#$.' (14/ 0#/' 6KOGT +0276 6;2' EJGEMDQZ 0#/' VKOGT$QZ QP%NKEM EJGEM6KOGT %[MNKEPKG OKGPKCL QDTC[ RQDKGTCPG RCOKúEK RQFTúEPGL (14/ %'06'4 $1; *6/. UVCTV NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Sposób wykorzystania właściwości UVCTV na stronie, która wyświetla klip wideo w ele- mencie +/), został przedstawiony na listingu 22.3, zamieszczonym we wcześniejszej części tego rozdziału.
  • 18. 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC Z [ NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Aby przewinąć dokument w taki sposób, by obraz znalazł się o kilka pikseli poni ej górnej krawędzi okna przeglądarki, mo na u yć następującego wywołania: YKPFQYUETQNN6Q FQEWOGPVKOCIGU=?Z FQEWOGPVKOCIGU=?[ 2TQEGFWT[ QDU WIK FCTG QP#DQTV QP'TTQT NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Na listingu 22.5 została zdefiniowana procedura obsługi zdarzeń QP#DQTV. Jeśli chcesz zapobiec wyświetlaniu obrazu, który ju znajduje się w pamięci podręcznej przeglądarki, będziesz musiał ją zamknąć i ponownie uruchomić. W przedstawionym przykładzie zapew- niłem mo liwość odświe ania całej strony. Sposób obsługi zdarzenia w głównej mierze zale y od projektu strony. Zawsze nale y jednak doło yć wszelkich starań, aby w jak największym stopniu ułatwić u ytkownikowi rozwiązywanie problemów, które mo e napotkać korzystając ze strony. QP.QCF NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Przed wypróbowaniem przykładu przedstawionego na listingu 22.5 powinieneś zamknąć i ponownie uruchomić przeglądarkę. Gdy dokument jest otwierany po raz pierwszy, po- czątkowo zostaje wyświetlony obraz określony za pomocą atrybutu .1954% (przedsta- wiający, w tym przypadku, gumki do ołówków), a dopiero później zdjęcie klawiatury. Gdy zdjęcie gumek zostanie ju pobrane, procedura obsługi zdarzenia QP.QCF wyświetla w polu tekstowym słowo FQPG . Dzieje się tak niezale nie od tego, e główny obraz (określony przy u yciu atrybut 54%) nie został jeszcze pobrany. Kolejny eksperyment
  • 19. ,CXC5ETKRV RT[M CF[ $KDNKC mo e polegać na pobraniu zdjęcia przedstawiającego łuk skalny. Pobranie tego obrazu zabiera znacznie więcej czasu, a zatem obraz tymczasowy określany dynamicznie za pomocą atrybutu .1954% zostanie wyświetlony znacznie wcześniej. .KUVKPI Procedura obsługi zdarzeń onLoad obrazów *6/. *'# 5%4+26 .#0)7#)' ,CXC5ETKRV HWPEVKQP NQCF+V VJG+OCIGHQTO ] KH FQEWOGPVKOCIGU ] HQTOTGUWNVXCNWG FQEWOGPVKOCIGU=?NQYUTE FGUMIKH FQEWOGPVKOCIGU=?UTE VJG+OCIG _ _ HWPEVKQP EJGEM.QCF HQTO ] KH FQEWOGPVKOCIGU ] HQTOTGUWNVXCNWG FQEWOGPVKOCIGU=?EQORNGVG _ _ HWPEVKQP UKIPCN ] KH EQPHKTO 2TGTYC G RQDKGTCPKG QDTCW %[ EJEGU RQDTCè IQ LGUEG TC! ] NQECVKQPTGNQCF _ _ 5%4+26 *'# $1; +/) 54% ERWIKH .1954% FGUMIKH 9+6* *'+)*6 QP.QCF KH FQEWOGPVHQTOU=?TGUWNV FQEWOGPVHQTOU=?TGUWNVXCNWG FQPG QP#DQTV UKIPCN (14/ +0276 6;2' DWVVQP 8#.7' 9[ YKGVN MNCYKCVWTú QP%NKEM NQCF+V ERWIKH VJKUHQTO +0276 6;2' DWVVQP 8#.7' 9[ YKGVN WM UMCNP[ QP%NKEM NQCF+V CTEJIKH VJKUHQTO 2 +0276 6;2' DWVVQP 8#.7' %[ QDTC LW RQDTCPQ! QP%NKEM EJGEM.QCF VJKUHQTO +0276 6;2' VGZV 0#/' TGUWNV (14/ $1; *6/. 1DKGMV GNGOGPVW #4'# 9 C EKYQ EK EQQTFU UJCRG NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność
  • 20. 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC 2T[M CF Sposób wykorzystania właściwości EQQTFU oraz UJCRG w skryptach obsługujących obiekty elementów /#2 został przedstawiony na listingu 22.7. 1DKGMV GNGOGPVW /#2 9 C EKYQ è CTGCU NN 2 NN 3 NN 4 NN 6 IE 3/J1 IE 3/J2 IE 4 IE 5 IE 5.5 Zgodność 2T[M CF Listing 22.7 demonstruje jak mo na zmieniać obiekty elementów #4'# umieszczone we- wnątrz elementu /#2. Początkowo na stronie jest wyświetlany obraz przedstawiający kla- wiaturę. Obraz ten jest skojarzony z mapą odnośników MG[DQCTF/CR obsługiwaną po stronie klienta i definiującą trzy wybrane obszary na klawiaturze. Jeśli u ytkownik zamieni obraz wyświetlany na stronie wewnątrz elementu +/), skrypt zmieni tak e wartość wła- ściwości WUG/CR obiektu elementu +/), tak aby wskazywała na drugi element /#2, znacznie lepiej dostosowany do nowego obrazu. Spróbuj przesuwać wskaźnik myszy w obszarze obu obrazów i sprawdź adresy URL skojarzone z poszczególnymi obszarami mapy, wy- świetlane na pasku stanu (w tym przykładzie, strony docelowe określane przez te adresy nie istnieją). Kliknięcie przycisku Wygeneruj mapę powoduje jednak wywołanie funkcji OCMG#TGCU tworzącej cztery nowe obiekty elementów #4'# i dodającej je do mapy skojarzonej z ob- razem (przy u yciu odwołań charakterystycznych dla DOM u ywanej przeglądarki). (Nale y zauwa yć, e funkcja OCMG#TGCU nie działa w przeglądarkach IE 5 dla kom- puterów Macintosh). Przesuwając wskaźnik myszy w obszarze obrazu po wygenerowaniu nowych obiektów elementów #4'#, mo emy zauwa yć, e wyświetlane są nowe adresy URL. Warto tak e zwrócić uwagę na pojawienie się czterech nowych obszarów; komu- nikaty o nich są wyświetlane na pasku stanu przeglądarki (patrz rysunek 6.2). .KUVKPI Dynamiczne modyfikowanie elementów AREA *6/. *'# 6+6.' 1DKGMV GNGOGPVW /#26+6.' 5%4+26 .#0)7#)' ,CXC5ETKRV F[PCOKEPKG IGPGTWLGO[ GNGOGPV[ #4'# HWPEVKQP OCMG#TGCU ] FQEWOGPVO[+/)UTE FGUMIKH VYQT[O[ QDKGMV[ GNGOGPVÎY CTGC XCT CTGC FQEWOGPVETGCVG'NGOGPV #4'#
  • 21. ,CXC5ETKRV RT[M CF[ $KDNKC CTGCJTGH 5ETKRV/CFG5JCFGJVON CTGCUJCRG RQN[IQP CTGCEQQTFU XCT CTGC FQEWOGPVETGCVG'NGOGPV #4'# CTGCJTGH 5ETKRV/CFG$CUGJVON CTGCUJCRG TGEV CTGCEQQTFU XCT CTGC FQEWOGPVETGCVG'NGOGPV #4'# CTGCJTGH 5ETKRV/CFG%JCKPJVON CTGCUJCRG RQN[IQP CTGCEQQTFU XCT CTGC FQEWOGPVETGCVG'NGOGPV #4'# CTGCJTGH 5ETKRV/CFG'ORV[PGUUJVON CTGCUJCRG TGEV CTGCEQQTFU YUVCYKCO[ PQYG GNGOGPV[ FQ Yú ÎY RQFTúFP[EJ GNGOGPVW /#2 KH FQEWOGPVCNN ] MQF FNC +' FQEWOGPVCNNNCORAOCRCTGCUNGPIVJ FQEWOGPVCNNNCORAOCRCTGCU=? CTGC FQEWOGPVCNNNCORAOCRCTGCU=? CTGC FQEWOGPVCNNNCORAOCRCTGCU=? CTGC FQEWOGPVCNNNCORAOCRCTGCU=? CTGC _ GNUG KH FQEWOGPVIGV'NGOGPV$[+F ] 00 LGUV IQFP[ OQFGNGO Yú ÎY 9% XCT OCR1DL FQEWOGPVIGV'NGOGPV$[+F NCORAOCR YJKNG OCR1DLEJKNF0QFGUNGPIVJ ] OCR1DLTGOQXG%JKNF OCR1DLHKTUV%JKNF _ OCR1DLCRRGPF%JKNF CTGC OCR1DLCRRGPF%JKNF CTGC OCR1DLCRRGPF%JKNF CTGC OCR1DLCRRGPF%JKNF CTGC TQYKæCPKG RTQDNGOW Y[ YKGVNCPKGO Y 00 FQEWOGPVO[+/)UV[NGFKURNC[ KPNKPG _ _ HWPEVKQP EJCPIG6Q-G[DQCTF ] FQEWOGPVO[+/)UTE ERWIKH FQEWOGPVO[+/)WUG/CR MG[DQCTF/CR _ HWPEVKQP EJCPIG6Q.COR ] FQEWOGPVO[+/)UTE FGUMIKH FQEWOGPVO[+/)WUG/CR NCOR/CR _ 5%4+26 *'# $1; * 1DKGMV GNGOGPVW /#2* *4 +/) 0#/' O[+/) 54% ERWIKH 9+6* *'+)*6 75'/#2 MG[DQCTF/CR /#2 0#/' MG[DQCTF/CR #4'# *4'( #NRC-G[UJVO 5*#2' TGEV %1145 #4'# *4'( #TTQY-G[UJVO 5*#2' RQN[IQP %1145 #4'# *4'( 2CIG-G[UJVO 5*#2' EKTENG %1145
  • 22. 4QFKC 1DKGMV[ +OCIG #TGC QTC /CR 4QFKC /#2 /#2 0#/' NCOR/CR + NCORAOCR #4'# *4'( 5JCFGJVO 5*#2' RQN[IQP %1145 #4'# *4'( $CUGJVO 5*#2' TGEV %1145 #4'# *4'( %JCKPJVO 5*#2' RQN[IQP %1145 /#2 (14/ 2 +0276 6;2' DWVVQP 8#.7' 9[ YKGVN QDTC NCOR[ QP%NKEM EJCPIG6Q.COR +0276 6;2' DWVVQP 8#.7' 9[IGPGTWL OCRú QP%NKEM OCMG#TGCU 2 2 +0276 6;2' DWVVQP 8#.7' 9[ YKGVN QDTC MNCYKCVWT[ QP%NKEM EJCPIG6Q-G[DQCTF 2 (14/ $1; *6/. 4[UWPGM Skrypt wygenerował specjalną mapę odnośników dostosowaną do wyświetlanego obrazu