Príručka k JavaScriptu
4. kapitola

4.0 Stavovy riadok

Ukazeme si ako sa da cokolvek zapisat do stavoveho riadku (riadku na spodku Vasho prehliadaca, kde sa normalne zobrazuju URLka) a samozrejme nezabudneme aj na tzv. posuvace textu, i ked sice uz nie su velmi oblubene.

Ako je adresovany stavovy riadok ? Tento skript Vam ukaze, ako je mozne nieco zapisat do stavoveho riadku:

Zdrojovy tvar:

<html>
<head>
<script language="JavaScript">
function statbar(txt) {
window.status = txt;
}
</script>
</head>
<body>
<form>
<input type="button" name="look" value="Napis" onclick="statbar('Toto je stavovy riadok');">
<input type="button" name="erase" value="Zmaz" onclick="statbar('');">
</form>
</body>
</html>

V tomto skripte sa vytvoria 2 tlacitka, ktore obe volaju funkciu statbar(txt) [txt v zatvorkach vyjadruje, ze funkcia ziskava udaj do premennej txt z volania funkcie]. Ako to funguje ? Jednoducho je potrebne do premennej window.status vlozit obsah premennej txt. To sa zabezpeci jednoducho: window.status=txt;. Zapisanie prazdneho retazca ('') do stavoveho riadku ho vymaze.

4.1 Funkcia setTimeout

V 2. kapitole sme si demonstrovali pouzitie vlastnosti onMouseOver. Urcite sa Vam nepacilo, ze text v stavovom riadku nezmizol, ked ukazovatel mysi prestal ukazovat na odkaz. Riesenie tohto problemu je jednoduche. Staci napisat malu funkciu, ktora pouziva rovnaku techniku ako nase mazacie tlacitko.

Vyskusajte ukazat mysou na tento odkaz.

Zdrojovy text:

<html>
<head>
<script language="JavaScript">
function moveover(txt) {
window.status = txt;
setTimeout("erase()",1000);
}
function erase() {
window.status="";
}
</script>
</head>
<body>
<a href="#" onMouseOver="moveover('Text zmizne!');return true;">
odkaz</a>
</body>
</html>

Asi uz velmi netreba vysvetlovat tento skript, kedze predchadzajuci bol jemu velmi podobny. Funkcia setTimeout() definuje ako dlho ma bezat casovac a co sa ma stat, ked dojde specifikovany cas. V nasom pripade sa vyvola po 1000 milisekundach (1s) funkcia erase().

4.2 Ako naprogramovat posuvajuci sa text

Kedze uz viete ako sa da pisat do stavoveho riadku a ako pracuje funkcia setTimeout(), nemali by ste mat problem s pochopenim nasledujuceho skriptu. Po stlaceni tlacitka sa zacne v stavovom riadku posuvat text.

Zdrojovy text:

<html>
<head>
<title>
</title>
<script>
<!--
function statusScroll(stuff)
{
var m1 = " Paci sa Vam takyto skrolujuci text ?";
var m2 = " Verte, ze JavaScript dokaze este viac !";
var m3 = " To by bolo asi vsetko.";
var msg = m1+m2+m3;
var out=" ";
var c=1;
if (stuff > 100) {
stuff --;
var cmd="statusScroll("+stuff+")";
timerTwo=window.setTimeout(cmd,100);
}
else if (stuff <=100 && stuff >0) {
for (c=0; c<stuff; c++){
out+=" ";
}
out+=msg;
stuff--;
var cmd="statusScroll("+stuff+")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else if (stuff <=0) {
if (-stuff <msg.length){
out+=msg.substring(-stuff, msg.length);
stuff--;
var cmd="statusScroll("+stuff+")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else {
window.status=" ";
timerTwo=window.setTimeout("statusScroll(100)",75);
}
}
}
// -->
</script>
</head>
<body onLoad="TimerONE=window.setTimeout('statusScroll(100)',500);">
</body>
</html>

Tento skript vyuziva rovnake funkcie (alebo ich casti), ktore sme uz pouzili. Funkcia setTimeout(...) hovori casovacu, aby spustil funkciu statusscroll() ked uplynie cas a tak sa posunie text o 1 znak. Na zaciatku mozete zbadat niekolko vypoctov, ktore vsak pre celkove pochopenie nie je nevyhnutne chapat. Vypocty sluzia na zistovanie pozicie zaciatku, kde ma zacat posuvanie textu. V uvode sme si povedali, ze tieto posuvace textu nie su velmi popularne, pretoze uz vysli z mody, no pre vyuku JavaScriptu mozu byt uzitocne.

Predchadzajuca kapitola - Nasledujuca kapitola - Obsah