Fotografický magazín "iZIN IDIF" každý týden ve Vašem e-mailu.
Co nového ve světě fotografie!
Zadejte Vaši e-mailovou adresu:
Kamarád fotí rád?
Přihlas ho k odběru fotomagazínu!
Zadejte e-mailovou adresu kamaráda:
JavaScript
DirectAnimation, 4.část: Sprite aneb Image je na nic :-)
12. září 2001, 00.00 | Po nějaké době se opět vracíme k našemu seriálu o DirectAnimation. Dnes se podíváme na prvek Sprite, pomocí něhož je možné
ovládat animované obrázky ve formátu GIF.
Po nějaké době se opět vracíme k našemu seriálu o DirectAnimation. Dnes se podíváme na prvek Sprite, pomocí něhož je možné ovládat animované obrázky ve formátu GIF.
Od posledního dílu našeho seriálu o DirectAnimation již přece jen uplynula delší doba, proto zde pro ty z vás, kteří již
zapomněli co že ta DirectAnimation vlastně je, přináším odkazy na minulé díly seriálu, aby je nemuseli hledat v
archivu Builderu:
DirectAnimation, 1.část: Úvod
DirectAnimation, 2.část: Structured Graphics
DirectAnimation, 3.část: Structured Graphics
podruhé
Proč používat prvek Sprite?
Nejpoužívanější formou animace na webu jsou nepochybně animované obrázky ve formátu GIF - ty jsou založeny na tom, že jednotlivé fáze animace jsou uloženy v jednom souboru bezprostředně za sebou. Tyto animace mají jednu velkou výhodu - je jí velikost souboru, která je pro publikování na webu jedním z nejdůležitějších hledisek. Tato výhoda je ale bohužel kompenzována tím, že tyto obrázky není možné ovládat tak, jako např. video záznam - pozastavovat, přetáčet apod. To již ale neplatí o Internet Exploreru, který právě pomocí prvku Sprite tyto obrázky ovládat umožňuje.
Vzhůru do toho
Nebudeme dlouho otálet a hned se podíváme, jak se prvek Sprite na stránku vkládá:
|
Vidíme tedy, že stejně jako všechny ostatní prvky DirectAnimation se i prvek Sprite na stránku vkládá pomocí tagu OBJECT a identifikátoru prvku CLASSID. Prvek je nutné pojmenovat pomocí parametru ID tagu OBJECT, jinak ho není možné ovládat pomocí skriptů. Prvku přiřazujeme vlastnosti pomocí tagů PARAM, které uvádíme uvnitř tagu OBJECT - nyní si tyto vlastnosti ukážeme:
|
Všechny tyto vlastnosti je možné číst i nastavovat v JavaScriptu, a to pomocí zápisu název prvku.vlastnost. V JavaScriptu navíc můžeme používat těchto několik vlastností, které jsou pouze ke čtení: Frame (udává číslo aktuálního snímku), NumFramesAcross (udává šířku zdrojového obrázku v počtu snímků), NumFramesDown (udává výšku zdrojového v počtu snímků), PlayState (vrací jeden ze těchto stavů animace: play, paused a stopped) a Time (udává celkový čas přehrávání animace).
Metody prvku Sprite
Kromě výše uvedených vlastností podporuje prvek Sprite i několik JavaScriptových metod. Ty se aplikují pomocí zápisu název prvku.metoda a jsou to FrameSeek(n) (nastaví přehrávání na n-tý snímek animace), Pause() (pozastaví animaci), Play() (spustí přehrávání animace) a Stop() (zastaví přehrávání animace a vrátí ji na začátek). Závěrem bych vás ještě rád seznámil s událostí onMediaLoaded, která se používá u tagu OBJECT a která se volá v momentě, kdy je prvek Sprite kompletně načtený (včetně obrázku).
A to je o prvku Sprite vše. Příště se podíváme na prvek Path a poté se již začneme zabývat využitím prvků DirectAnimation v praxi.
Obsah seriálu (více o seriálu):
- DirectAnimation, 1.část: Úvod
- DirectAnimation, 2.část: Structured Graphics
- DirectAnimation, 3.část: Structured Graphics podruhé
- DirectAnimation, 4.část: Sprite aneb Image je na nic :-)
- DirectAnimation, 5.část: Path
Poslat článek
Nyní máte možnost poslat odkaz článku svým přátelům:
-
25. listopadu 2012
-
30. srpna 2002
-
10. října 2002
-
4. listopadu 2002
-
12. září 2002
-
25. listopadu 2012
-
28. července 1998
-
31. července 1998
-
28. srpna 1998
-
6. prosince 2000
-
27. prosince 2007
-
4. května 2007