Obiectul imaginii
Caracteristicile imaginii
Toate obiectele din clasa Imaginea pot fi împărțite în embedded și generate de programator. Obiectele încorporate sunt imagini ale containerelor IMG. Dacă aceste imagini sunt numite, ele pot fi adresate după nume. De exemplu, dacă avem o imagine (vom presupune că aceasta este prima din document):
atunci valoarea proprietății document.images [0] .name este "picname", iar imaginea însăși poate fi accesată în trei moduri:
Proprietățile src și lowSrc
Proprietățile src și lowSrc determină adresa URL a imaginii montate în interiorul documentului. În acest caz, lowSrc definește o imagine temporară, de obicei una mică, care este afișată în timp ce imaginea principală este încărcată, a cărei adresă URL este specificată în atributul SRC al containerului IMG. Proprietatea src ia valoarea atributului SRC al containerului IMG. Programatorul poate modifica valorile și src. și lowSRC. În exemplul anterior, putem schimba valoarea lui src după cum urmează:
După cum puteți vedea din acest exemplu, este posibil să modificați imaginea modificând valoarea proprietății src a obiectului Imagine încorporată. Dacă prima dată când navigați pe această pagină (de exemplu, imaginile nu sunt memorate în cache de browser), schimbarea treptată a imaginii va fi văzut (desigur, la o conexiune de viteză mică la Internet, și depinde de browser-ul, care poate încărca o imagine, și numai atunci scoateți-l în întregime pe pagină). Cum să accelerați această modificare, vom lua în considerare în secțiunea următoare.
Schimbarea imaginii
Soluția este de a dilua imaginea și de ao afișa. Mai întâi, creăm imagini la care conectăm handlers-urile evenimentului onMouseOver și onMouseOut. Când poziționați indicatorul mouse-ului peste fiecare dintre imagini, acesta este înlocuit cu altul (culoarea) și când trageți mouse-ul, imaginea este înlocuită cu alb-negru:
Cu toate acestea, principalul lucru nu este că imaginile sunt înlocuite, dar cu viteza cu care o fac. Pentru a obține rezultatul dorit, sunt create tablouri de imagini la începutul paginii, în care toate imaginile sunt transferate înainte de a fi afișate. În acest scop, utilizați constructorul de obiect Imagine:
A fost în acel moment, atunci când proprietatea, de exemplu, mono-[25] .src prisvavaetsya valoare „imagini / mapb025.gif“, și de a descărca această imagine vine de la un site de pe calculatorul utilizatorului. Dacă în loc de obiecte din clasa Image am făcut o serie de linii ca "images / mapb000.gif" etc. atunci nu s-ar întâmpla nicio grafică de încărcare și de fiecare dată când utilizatorul ar arăta la următoarea imagine, browserul va trebui să descarce o nouă fotografie. Am pus acest script într-un container
. garantând astfel că, în momentul în care utilizatorul începe să lucreze cu pagina, toate necesare pentru imaginea trebuie să fie descărcate, iar procesul de conducere a mouse-ului pe imagini nu este de afișare întârziere următoarea imagine va fi observată.În trecere, să fim atenți la următorul truc folosit în scenariu. Să presupunem că trebuie să scriem 32 de linii:
Articole similare
-
Cunoștințe, lectură, societăți orientale în ajunul istoriei moderne
-
Cunoștințe, prelegere, calculator 2d-graphics în studioul de jocuri microsoft xna 3
Trimiteți-le prietenilor: