Specializovan² t²denφk o v²poΦetnφ technice
o Internetu
(CW 42/97)

---

O₧ivovßnφ WWW strßnek

David ètrupl

Narazφme-li p°i prochßzenφ Webu na strßnku, kde se n∞co h²be, je v zßsad∞ n∞kolik mo₧nostφ, jak takovß v∞c mohla vzniknout. Probereme si nynφ po po°ßdku prost°edky, kterΘ mß nßvrhß° strßnky k dispozici. NauΦφme se poznßvat, o kterΘ o₧ivenφ HTML se jednß. Budu zde popisovat postup v prohlφ₧eΦi Netscape Navigator, u ostatnφch prohlφ₧eΦ∙ by postupy m∞ly b²t analogickΘ.

Animovan² gif

NejjednoduÜÜφ forma o₧ivenφ strßnky spoΦφvß v tom, ₧e pomocφ grafickΘho programu vytvo°φme tzv. animovan² gif, neboli obrßzek obsahujφcφ animaci. Na strßnce jej poznßme podle toho, ₧e

- pokud na n∞j klikneme prav²m tlaΦφtkem myÜi (Netscape Navigator), tak se v polo₧ce menu objevφ °ßdek View Image nebo Save Image As,

- ve zdrojovΘm k≤du HTML je p°φkaz <img src="neco.gif">.

Pokud chceme takov² obrßzek vytvo°it, staΦφ pou₧φt p°φsluÜn² grafick² program a do HTML strßnky jej vlo₧φme jako obyΦejn² obrßzek.

Plug-in

Pokud mßme prohlφ₧eΦ vybaven pro prohlφ₧enφ n∞kter²ch druh∙ soubor∙ specißlnφm dopl≥kem (plug-in), m∙₧e WWW strßnka obsahovat p°φkaz:

<embed src="Afls/shiplogo.afl">

P°φkazem embed se vklßdajφ na strßnku specißlnφ druhy obsahu. Jestli₧e chceme zjistit, zda nßÜ prohlφ₧eΦ dan² soubor dokß₧e zpracovat, musφme to zjistit nap°. v polo₧ce menu About Plugins (Netscape). Nap°. m∙j prohlφ₧eΦ mß nainstalovßnu podporu pro hranφ zvuk∙ -- bude-li strßnka obsahovat nßsledujφcφ p°φkaz:

<embed src="Sound.wav" width=200 autostart=true>

bude prohlφ₧eΦ hrßt. Pou₧itφ plug-in∙ je vÜak limitovßno pouze na u₧ivatele s p°φsluÜn²m prohlφ₧eΦem.

Java

Java applet poznßme podle toho, ₧e ve zdrojovΘm k≤du strßnky najdeme p°φkaz:

<applet code=Zobraz.class width=100 height=100>

</applet>

Java applet se nastartuje, pokud prohlφ₧eΦ podporuje Javu a u₧ivatel pou₧φvßnφ Javy povolil.

JavaScript

JavaScript je jazyk rozÜi°ujφcφ HTML, kter² navrhla a implementovala firma Netscape. Na jejφch strßnkßch je tedy vhodnΘ hledat p°φpadnΘ pouΦenφ o tomto jazyce (http://www.netscape.com). V tomto Φlßnku si ukß₧eme, jak pou₧φt n∞kterΘ p°φkazy JavaScriptu pro o₧ivenφ naÜich WWW strßnek.

P°φkazy JavaScriptu se mohou v HTML vyskytovat na kterΘmkoliv mφst∞ strßnky. Obvykle se vÜak objevujφ na dvou mφstech. Na zaΦßtku strßnky b²vß uvedeno n∞kolik pomocn²ch funkcφ. VÜechny Φßsti strßnky napsanΘ v JavaScriptu jsou souΦßstφ p°φkazu <SCRIPT>. Za tφmto p°φkazem nßsleduje vlastnφ k≤d programu v JavaScriptu. DruhΘ mφsto, kde se JavaScript m∙₧e vyskytovat, je jako souΦßst n∞kter²ch obyΦejn²ch HTML p°φkaz∙, kde ho najdeme v podob∞ dalÜφch parametr∙ p°φkaz∙.

Na tomto mφst∞ si nebudeme ukazovat kompletnφ programovßnφ v JavaScriptu -- p°φkaz SCRIPT nechßme na specißln∞jÜφ pojednßnφ. Podφvßme se ale, jak modifikovat n∞kterΘ vlastnosti naÜφ strßnky pomocφ jednoduch²ch p°φkaz∙ p°idan²ch jako parametry ke standardnφm p°φkaz∙m HTML jazyka.

Nejvd∞Φn∞jÜφ je ukßzka, jak zm∞nit obrßzek p°i n∞jakΘ udßlosti. Reakci na udßlost p°ipojφme nap°. k p°φkazu kotvy:

<a href=z.html onMouseOver="obrazek.src='obr2.jpg';" onMouseOut="obrazek.src='obr1.jpg';">

<img src="obr1.jpg" name=obrazek> </a>

P°edpoklßdejme, ₧e chceme, aby se na n∞jakΘm mφst∞ zobrazil obrßzek obr1.jpg. V okam₧iku, kdy u₧ivatel p°ejede myÜφ p°es hyperlink, obrßzek se zm∞nφ na obr2.jpg. Tohoto efektu je dosa₧eno tφm, ₧e p°φsluÜnß linka obsahuje reakce na udßlosti onMouseOver a onMouseOut. VÜimn∞te si, ₧e k tomu, aby se obrßzek zm∞nil, je nutnΘ jej pojmenovat pomocφ parametru name p°φkazu img. Na toto jmΘno se pak m∙₧eme odkazovat z p°φkaz∙ JavaScriptu.

JavaScript se dß pou₧φt jeÜt∞ na n∞kolik dalÜφch o₧ivenφ strßnky, nap°. p°i vypl≥ovßnφ formulß°∙. Pouze je t°eba mφt na pam∞ti, ₧e p°φkaz∙m rozumφ pouze n∞kolik nejb∞₧n∞jÜφch prohlφ₧eΦ∙ (Netscape, MSIE) -- ostatnφ u₧ivatelΘ naÜich strßnek majφ sm∙lu. Je vhodnΘ v₧dy u₧ivatele upozornit, ₧e vÜechny mo₧nosti strßnky nemusφ b²t pln∞ vyu₧itelnΘ ve vÜech prohlφ₧eΦφch.