Lo script che presentiamo permette di impostare un messaggio scorrevole dal basso verso l'alto in un punto qualsiasi del nostro documento html.
L'esempio si compone di 1 file:
- esempio.htm
Per una più semplice comprensione del presente script fai continuamente riferimento ai file sopracitati, verificando le procedure e i dati espressi. Solo in questo modo, con un continuo confronto, comprenderai le peculiarità di questo Javascript.
La prima cosa da fare è introdurre i seguenti fogli di stile tra i tag <head>:
<style type="text/css">
#mymessage {
width:160px;
height:2000px;
font-family:Arial;
font-size:8pt;
color:000000;
}
A {
color:FF0000;
}
A:Hover {
font-weight:bold;
color:FFFFFF;
background-color:FF0000;
}
</style>
La parte fondamentale di questo script va messa tra i tag <head>:
<script language="JavaScript1.2">
<!--
var i_scroll=0
var pause=2
var step=2
var scrollheight=800
function scrollwindow() {
window.scroll(0,i_scroll)
i_scroll+=step
if (i_scroll>= scrollheight) {i_scroll=0}
var timer= setTimeout("scrollwindow()",pause)
}
window.onload=scrollwindow
//-->
</script>
Passiamo ora alla personalizzazione del codice.
per quanto riguarda i CSS possiamo modificare alcune variabili a nostro piacimento:
width:160px;
indica la larghezza che avrà il campo di testo
height:2000px;
indica l'altezza del campo di testo (dovrà sempre essere maggiore della lunghezza del testo stesso)
font-family:Arial;
indica il tipo di font utilizzato
font-size:8pt;
indica la grandezza del testo in punti
color:000000;
indica il colore del testo.
Il codice javascript invece può essere modificato in questo modo:
var pause=2
var step=2
rappresentano la velocità e la pausa dello scroll. possono essere modificate a piacimento per ottenere l'effetto desiderato. più basso sarà il valore e più lento sarà lo scorrimento del testo e viceversa.
var scrollheight=800
indica l'altezza del campo di scorrimento.
Il resto dello script non va modificato.
Fatto questo è necessario inserire tra i tag <body> il corpo del messaggio:
<div id="mymessage">
Html.it - Il sito italiano sul web publishing: raccolte javascript, applet, Dhtml e tutorials su linguaggi come PHP, ASP, Perl, CGI.
<a href="http://www.html.it">HTML.it</a> clicca sul link e migliora le tue pagine con tanti accessori.
Free.html.it - La sezione di Html.it dedicata ai servizi free della rete.
<a href="http://free.html.it">FREE.html.it</a> clicca il link per trovare chat, forum, guestbook, motori di ricerca, email e molto altro.
Se hai bisogno di un servizio gratuito per il tuo sito questo è il sito giusto
Download.html.it - La sezione di Html.it dedicata ai migliori software in circolazione
<a href="https://download.html.it">DOWNLOAD.html.it</a> clicca il link se hai bisogno di un programma per costruire il tuo sito
<a href="http://www.html.it"><img src="../../Documenti/htmlit.gif" width=88 height=30 border="0" alt="HTML.it - il sito italiano sul Web publishing"/></a>
<font face="Arial" size="1"> Script offerto da <strong><a href="http://www.html.it">HTML.it</a></strong>
e commentato da <a href="mailto:lorenzoforti@html.it">Lorenzo Forti</a>.
<font face="arial" color="Red">L'uso e la diffusione di questo codice è gratuita per siti non commerciali</font>
<a href="https://www.html.it/jscript">Per altri Javascript visita la nostra raccolta con più di 300 esempi</a>
</font></div>
come si può notare l'intero messaggio dovrà essere contenuto tra i tag <div> e </div>. all'interno di questa area si potrà scrivere tutto il testo inserendo link ed immagini.
