13. března 2004
.:Přidat k oblíbeným
.:Napsat e-mail





Lekce
Příklady

Cílem této série připravovaných článků by mělo být, uvést vás do tajů poměrně mladého (ale už ne zas tak moc nového) způsobu tvorby různých "vychytávek" na vašich stránkách. Co k tomu potřebujete? Celkem skoro nic, možná alespoň základní znalost HTML a trochu času stráveného u těchto stránek. Teď snad zbývá jenom začít.

Co vlastně DHTML dokáže?

DHTML (Dynamické HTML) by vám mělo pomoci vnést trochu té interaktivity do vašich stránek a tím je také mírně "okořenit." Vlastně spousta věcí, které pozorujete, dnes už na spoustě stránek, je vytvořena pomocí DHTML. Např.: měnící se obrázky (po přejetí myší, kliknutí nebo jen tak), měnící se text a hromada dalších věcí. Samozřejmě ne vše na stránkách je vytvořeno v DHTML, existuje např. Java, Flash atd. Prostě DHTML není tak úplně všemocné, ale chytrým kombinováním můžete vytvořit i něco nového, neotřelého a hlavně není to zas tak těžké.

Tak rovnou po hlavě do toho!

Ještě než začnu se samotným popisem DHTML, pokusím se vám ukázat základní strukturu tohoto jazyka na jednoduchém příkladu, který můžete potkat na mnoha stránkách. Je to obrázek, a když po něm přejedete myší, vyplivne na vás duchaplný vzkaz:

blikac.gif

Jak to vypadá ve zdrojovém kódu?

<html>
<head>
   <title>DHTML</title>

<script type="text/javascript">
<!--
function zprava()
{
   alert("Kukk!!!");
}
//-->
</script>

</head>

<body bgcolor="#ffffcc">

<img src="blikac.gif" onMouseOver="zprava()">

</body>
</html>

A co to tedy znamená?

Tak předně, pokud už jste někdy viděli HTML, víte, že první 3 řádky se píší do všech stránek. Proto se tou hlavičkou nebudu dále zabývat. Co je ale zajímavější, je kontejner <script type="text/javascript">. Ano už je to tady. Sem se píše vlastní skript. Jednak tento kontejner uvádí deklarace funkcí (příkazů), které bude stránka provádět, a jednak určuje jakým jazykem budete tyto funkce psát (v tomto případě je to JavaScript - no kdo by to řek). Oddíl deklarací funkcí musí být samozřejmě také ukončen, a to příkazem </script>.

Hm! Tak to bysme měli. Teď function. Tohle kouzelné slůvko je něco jako prosím. Každá funkce má asi takovouhle strukturu:

function název_funkce ([proměnná/é])
{
  [tělo funkce]
}

function:

Každá funkce musí mít nějaký název, jehož pomocí se na ni budete odkazovat. Názvy nepište moc dlouhé, když máte vypsat nějaký román třeba jenom třikrát, brzy se to omrzí. Na druhou stranu, ovšem, správný název je dostatečně výmluvný, aby bylo na první pohled zřejmé, co která funkce dělá (čili žádné xjfjy...).
Za každým názvem funkce se píše (). Někdy jsou tyto závorky prázdné, ale přesto zde musí být. Někdy je zde jeden nebo více názvů proměnných (parametrů) oddělených čárkami. Na parametry se podíváme později - zatím na ně můžete klidně zapomenout.
Každá funkce obsahuje {}, složené závorky. Tuhle { jako začátek funkce a tuhle } jako konec funkce.
No a drtivá většina funkcí má nějaké tělo (stejně jako lidé), i když je to třeba nějaký patvar (stejně jako funkce). Toto tělo je ohraničeno právě {} složenými závorkami. Co to vlastně tělo funkce je, vylíčím až později.

To není všechno!

Funkci jste si sice deklarovali, ale je to pořád ještě trochu bezduché. Aby stránky byly opravdu interaktivní, musí tuto funkci vyvolat nějaký podnět (událost). Těmito podněty se budu zabývat pravděpodobně v další lekci. Jen pro úplnost. V našem příkladu byla užita událost onMouseOver, čili reakce na přejetí myší. Jak se tam vpašuje ta funkce, můžete vytušit už z příkladu, ale pokud se vám to nezdaří nezoufejte. V příštích lekcích se touto problematikou budu zabývat podrobněji.

Závěrem:

Pokud je vám něco nejasné napište mi to do naší vaší listárny. Samozřejmě tento příklad není na internetu jediný. Na většině stránek ve skutečnosti najdete nějaký ten skriptík. Není nic jednoduššího, než si ho prohlédnout (např. menu Zobrazit/Zdrojový kód - v Internet Exploreru) a nalézt v něm příklad nějaké té deklarace funkce. Jak to bude s jeho srozumitelností, to už vám ale nepovím.

Mort
Iedere speler die wil leren hoe de roulettespellen werken kan bij GamblingCity.net terecht. Hier leer je roulette strategieën en krijg je waardevolle roulette tips om je spel mee te verbeteren.


 


Další lekce >>
_
^
Back to top

Valid XHTML 1.0!   Valid CSS!
TOPlist