Animace části velkého obrázku
Animované GIFy mohou být velkou předností webové stránky.
Zároveň jsou však náročné na velikost souboru, obzvlášť jsou-li vytvářeny
z velkých obrázků. Obrázek proto rozdělíme na několik částí a
animujeme jen jednu, menší část obrázku.
Touto technikou dosáhnete toho, že:
|
Soubory budou malé.
Animace pouze části velkého obrázku pomáhá redukovat dobu natažení, přestože
vizuální stránka zůstává výrazná. |
|
Větší obrázky ožijí.
Můžete vzít třeba portrét a nechat ho koulet očima, anebo nakreslit
psa, jak vrtí ocasem.
|
|
Přitáhnete oko diváka.
Náznak pohybu v jinak nehybném obrázku určitě upoutá
divákovu pozornost.
|
Vytvoření animace velkého obrázku:
1. V grafickém editoru vytvořte obrázek a rozdělte ho
na animované a statické části.
2. Části obrázku sestavte vedle sebe
pomocí tabulky s atributy
BORDER=0
CELLPADDING=0
CELLSPACING=0 a s atributy ALIGN=left|center|right VALIGN=top|middle|bottom podle polohy v tabulce.
Příklad:
< TABLE align=center width=400 height=600 border=0
cellpadding=0 cellspacing=0>< TR>< TD rowspan=9 align=left>
< IMG src="animace/leva.gif" width=109 height=600>< /TD>
< td valign=bottom align=center>
< IMG src="animace/horni.gif" width=114 height=102>< /td>
< td rowspan=9 align=right>
< IMG src="animace/pravap.gif" width=177 height=600>< /td>
< /TR>< TR>< td valign=middle align=center>¨
< IMG src="animace/d7.gif" width=114 height=38>< /td>< /TR>
< TR>< td valign=middle align=center>
< IMG src="animace/d6.gif" width=114 height=38>< /td>< /TR>
< TR>< td valign=middle align=center>
< IMG src="animace/d5.gif" width=114 height=35>< /td>< /TR>
< TR>< td valign=middle align=center>
< IMG src="animace/d4.gif" width=114 height=169>< /td>< /TR>
< TR>< td valign=middle align=center>
< IMG src="animace/d3.gif" width=114 height=36>< /td>< /TR>
< TR>< td valign=middle align=center>
< IMG src="animace/d2.gif" width=114 height=21>< /td>< /TR>
< TR>< td valign=middle align=center>
< IMG src="animace/d1.gif" width=114 height=13>< /td>< /TR>
< TR>< td valign=top align=center>
< IMG src="animace/dolni.gif" width=114 height=148>< /td>
< /TR>< /TABLE>
Takhle to vypadá
Začátek
Další
Předchozí