Nwlapcug.com


Come scorrere un testo scorrevole in JavaScript

Il tag di selezione è un elemento HTML non standard infame, risalente ai primi anni del World Wide Web. Contenuto inserito in un riquadro di selezione si scorre ancora e ancora, attirando l'attenzione dell'utente. Il tag di selezione in HTML è obsoleta e il suo utilizzo è scoraggiato dalla maggior parte degli sviluppatori Web. Tuttavia, si può resuscitare l'elemento marquee nelle pagine Web utilizzando il codice JavaScript e CSS.

Istruzioni

1

Inserire il codice JavaScript seguente tra i tag di "head" del documento HTML:

< script type = "text/javascript" >

ritardo di var = 10, quantità = 1;

Function scrollMarquee(id) () {

var ref=document.getElementById(id);

ref.scrollLeft += amount;

if(ref.scrollLeft >= ref.scrollWidth - ref.offsetWidth){

ref.scrollLeft = 0;

}

setTimeout("scrollMarquee('"+id+"');",delay);

}

< / script >

2

Aggiungere il seguente codice CSS tra i tag di "head" del documento HTML:

< style type = "text/css" >

.Marquee () {

overflow: hidden;

white-space: nowrap;

}

.Pad () {

display: inline-block;

Larghezza: 100%;

}

< / stile >

3

Aggiungere il seguente codice al corpo del documento HTML dove si desidera inserire un testo scorrevole:

< div class = "marquee" id = "marquee1" style = "width: 150px;" >< span class = "pad" >< / span >

Qui va il contenuto di testo scorrevole

< span class = "pad" >< / span >< / div >< script type = "text/javascript" > scrollMarquee('marquee1'); < / script >

Specificare la larghezza del riquadro di selezione nell'attributo "style" del tag "div". È possibile utilizzare pixel (px) o come percentuale della larghezza della pagina (%). Posizionare il contenuto del riquadro di selezione tra la prima e l'ultima riga. È possibile includere qualsiasi contenuto HTML che ti piace. Se volete fare un'altra selezione, semplicemente incollare il codice nuovamente altro sulla pagina e modificare l'attributo "id" del tag "div" e l'argomento della chiamata "scrollMarquee" a un nome univoco, ad esempio "marquee2".

Consigli & Avvertenze

  • Modificare le variabili di "quantità" e "ritardo" nel codice JavaScript per modificare la velocità del testo scorrevole. "Quantità" è il numero di pixel che si sposta il riquadro di selezione ogni volta che scorre, e "ritardo" è la quantità di tempo tra ogni scorrimento in millisecondi.