Introduzione a JavaScript
Part 4
Introduzione a JavaScript
Part 4
La statusbar.
Come é possibile indirizzare del testo nella
statusbar ? Lo script che segue mostra come fare:
Ecco il sorgente dello script:
<html>
<head>
<script language="JavaScript">
<!-- Hide
function statbar(txt) {
window.status = txt;
}
// -->
</script>
</head>
<body>
<form>
<input type="button" name="look" value="Write!" onclick="statbar('Hi! This is the statusbar!');">
<input type="button" name="erase" value="Erase!" onclick="statbar('');">
</form>
</body>
</html>
Sono stati creati due pulsanti, i quali eseguono delle chiamate alla function statbar(txt). Txt nelle parentesi indica la variabile che viene passata alla function. Si puó notare all'interno del tag <form> come eseguire le chiamate alla function statbar(txt), in realtá non viene passata un variabile vera e propia, ma una stringa di testo, che nel secondo caso (bottone Erase) é vuota e serve per cancellare il contenuto della statusbar.
Abbiamo giá visto la proprietá onMouseOver nella seconda parte del tutorial:
<a href="tpage.htm"
onMouseOver="window.status='ecco un'altro link...'; return
true">
É anche possibile impostare un timer in modo da cancellare la scritta sulla statusbar dopo un determinato tempo:
Prova a spostare il puntatore del mouse qui ma non cliccare !
Ecco il sorgente:
<html>
<head>
<script language="JavaScript">
<!-- Hide
function moveover(txt) {
window.status = txt;
setTimeout("erase()",1000);
}
function erase() {
window.status="";
}
// -->
</script>
</head>
<body>
<a href="dontclck.htm" onMouseOver="moveover('Disappearing!');return true;">
link</a>
</body>
</html>
In questo secondo script é stata aggiunta la function erase(), nell'HTML é stato creato un link utilizzando la propietá onMouseOver. La function moveover(txt) viene chiamata passando la stringa 'Disappearing!'. Alla variabile 'window.status' viene assegnato il contenuto di txt. La stessa cosa accadeva per la function statbar(txt). La function setTimeout(...) invece setta il tempo durante il quale la stringa deve stare visualizzata sulla statusbar e indica che cosa deve accadere allo scadere di questo tempo. Nell'esempio la function erase() viene chiamata dopo 1000 millisecondi (1 secondo).
Ecco lo script:
<html>
<head>
<script language="JavaScript">
<!-- Hide
var scrtxt="Questo é il messaggio che scorre sulla statusbar";
var lentxt=scrtxt.length;
var width=100;
var pos=1-width;
function scroll() {
pos++;
var scroller="";
if (pos==lentxt) {
pos=1-width;
}
if (pos<0) {
for (var i=1; i<=Math.abs(pos); i++)
{ scroller=scroller+" ";}
scroller=scroller+scrtxt.substring(0,width-i+1); }
else { scroller=scroller+scrtxt.substring(pos,width+pos); }
window.status=scroller; setTimeout("scroll()",150); } //-->
</script>
</head>
<body onLoad="scroll();return true;"> Inserire qui la vostra pagina </body> </html>
Questo scripts utilizza functions o parti di esse che abbiamo gia visto. Le operazioni che vengono fatte all'inizio servono per calcolare le posizioni di partenza, ma non sono importanti per capire come lo script lavora.
Ultimo aggiornamento: