P°φruΦka pro snadnou tvorbu html dokument∙.
Jak na propadßvacφ tlaΦφtka
Zde naleznete popis jak co nejjednodu╣eji vytvo°it efekt propadßvajφcφch se tlaΦφtek p°i najetφ my╣i na
1. Nejd°φve si musφme nakreslit dva obrßzky pro tlaΦφtko, jeden "nepropadl² - nezmßΦknut²" a jeden "propadl² - zmßΦknut²". Ten druh² musφ b²t posunut² o pßr pixel∙, aby se docφlilo po╛adovanΘho efektu.
 |
 |
| NezmßΦkutΘ tlaΦφtko |
ZmßΦknutΘ tlaΦφtko |
2. NezmßΦknutou verzi tlaΦφtka umφstφme na strßnku standardnφm zp∙sobem
<IMG SRC="tlacitko0.gif" WIDTH=81 HEIGHT=35 BORDER=0 ALT="">
3. K tomuto tlaΦφtku p°i°adφme nßzev
<IMG SRC="tlacitko0.gif" NAME="tlacitko" WIDTH=81 HEIGHT=35 BORDER=0 ALT="">
4. Vytvo°φme odkaz
<A HREF="tlacitko.html"><IMG SRC="tlacitko0.gif" NAME="tlacitko" WIDTH=81 HEIGHT=35 BORDER=0 ALT=""></A>
5. Te∩ definujeme co se stane po najetφ my╣i do oblasti obrßzku.
<A HREF="tlacitko.html" ONMOUSEOVER="ChangeImage('tlacitko','1')"><IMG SRC="tlacitko0.gif" NAME="tlacitko" WIDTH=81 HEIGHT=35 BORDER=0 ALT=""></A>
Tφmto °ekneme aby se po najetφ kurzoru my╣i do oblasti obrßzku spustil skript ChangeImage s parametry tlacitko a 1.
6. Dßle definujeme co se stane p°i opu╣t∞nφ oblasti obrßzku.
<A HREF="tlacitko.html" ONMOUSEOVER="ChangeImage('tlacitko','1')" ONMOUSEOUT="ChangeImage('Tlacitko','0')"><IMG SRC="tlacitko0.gif" NAME="tlacitko" WIDTH=81 HEIGHT=35 BORDER=0 ALT=""></A>
7.Te∩ nejd∙le╛it∞j╣φ Φßst: JavaScript
<SCRIPT LANGUAGE="JavaScript">
<!--
if ((navigator.appName == "Netscape" &&
parseInt(navigator.appVersion)
>= 3) || (navigator.appName ==
"Microsoft Internet Explorer" &&
parseInt(navigator.appVersion) >=4))
Java = "Enabled";
else Java = "Disabled";
if (Java == "Enabled")
{
tlacitko0 = new Image();
tlacitko0.src = "tlacitko0.gif";
tlacitko1 = new Image();
tlacitko1.src = "tlacitko1.gif";
}
function ChangeImage(ImgName,OnOff)
{
if (Java == "Enabled")
{
ImageSource = eval (ImgName + OnOff);
document[ImgName].src = ImageSource.src;
}
}
//-->
</SCRIPT>
|
Definice JavaScriptu
ZaΦßtek vlastnφho scriptu
\
|
| Zde probφhß kontrola zda mß u╛ivatel
| IE alespo≥ verze 4 nebo NN verze 3
| jinak propadßvßnφ nefunguje
/
Nemß-li NN 3 nebo IE 4 zakß╛e se script
Mß-li NN 3 nebo IE 4 provede se script
Definuje a stahuje se -
- nezmßΦknutΘ tlaΦφtko
Definuje a stahuje se -
- zmßΦknutΘ tlaΦφtko
Definice funkce ChangeImage
Provßdφ se jen p°i NN >3 nebo IE >4
Sestavenφ odkazu na obrßzek
Zßm∞na obrßzku v dokumentu
Konec t∞la skriptu
Konec JavaScriptu
|
U JavaScript∙ je d∙le╛itΘ dodr╛ovat velikost pφsmen, promn∞nnß A nenφ promn∞nnß a. V²hoda tohoto scriptu je v jeho pou╛itelnosti pro vφce obrßzk∙, nemusφte toti╛ znovu a znovu psßt cel² script, ale staΦφ p°idßvat jen 4 °ßdky pro definovßnφ obrßzk∙ (v tomto p°φkladu tlacitko0 = new Image(); tlacitko0.src = "tlacitko0.gif"; tlacitko1 = new Image(); tlacitko1.src = "tlacitko1.gif";
).
8. V²sledek
9. Nefunguje ? To nenφ nic neobvyklΘho. Zkontrolujte:
1. Je u ka╛dΘho tlaΦφtka - obrßzku definovßno jmΘno NAME="jmeno"?
2. Nemßte r∙znΘ velikosti pφsmen?
3. Nemßte n∞kde p°eklep?
4. Mßte JavaScript p°ed pou╛itφm vlastnφho tlaΦφtka jako odkazu?
5. Stßhn∞te si tento p°φklad a opravte podle n∞j vß╣ k≤d.
10. Pro lep╣φ efekt zkuste p°idat stφn.
Tento html dokument nesmφ b²t komerΦn∞ ╣φ°en bez souhlasu autora!
Copyright ©1998 Jan Klepal