INTERNET EXPLORER? Ti consiglio di navigare questo sito con Mozilla Firefox oppure con Google Chrome.

Testo ad effetto macchina da scrivere in Dhtml

Autore: Luca Ruggiero | Tell a Friend

Corso Java
Impara a programmare col linguaggio OOP della Sun.

Corso Javascript e DHTML
Impara a creare controlli ed animazioni!

Corso Web Design
Disegno di siti Web con HTML, CSS e Dynamic HTML.

Concesso in esclusiva a MrWebmaster.it - E' vietata la pubblicazione senza espresso consenso del proprietario

Un effetto sul testo molto carino che, se ben stilizzato può risultare di grande impatto, è quello comunemente chiamato macchina da scrivere, dato che i caratteri compaiono a video singolarmente come se digitati in sequenza da una tastiera.

Utilizzeremo un script DHTML compilato in codice Javascript, facendo quindi a meno di programmi più pesanti e meno accessibili come, ad esempio, Flash.

Stamperemo a video il testo in un Tag HTML puro, in modo da non perdere nemmeno indicizzazione sui motori di ricerca; al Tag testuale utilizzato applicheremo un ID che chiamiamo, per semplicità, "testo" 

<div id="testo">MRW Corsi - Corsi online professionali!</div>
ed utilizzeremo il seguente script per richiamarlo 
var i = 0;
function scrivi()
{
    var ID = document.getElementById("testo");
    ID.insertAdjacentText("beforeEnd", temp.charAt(i));
    if (i < temp.length - 1)
    {
        i++;
        setTimeout("scrivi()", 100);
    }
}
function inizio()
{
    var ID = document.getElementById("testo");
    temp = ID.innerHTML;
    ID.innerHTML = "";
    scrivi();
}
Il funzionamento è semplice: utilizziamo il metodo insertAdjacentText per effettuare la stampa a video e le temporizzazioni per perpetuare l'incremento dello script e la relativa stampa sequenziale a video.

Lanciamo la funzione al caricamento della pagina 
<body onload="inizio()">
ed il gioco è fatto!

IN EVIDENZA
Una slidegallery con jQuery Pagamenti online con PayPal e PHP Breve guida a jQuery Effetto ombra su testo con Photoshop Guadagna col tuo sito grazie a TradeD... Guida XHTML Riscrivere le URL con Asp Riavviare IIS HTTP 500 internal server error Generare password casuali in Javascri... Errore 80004005: Cannot update. Datab... Introduzione ad Ajax ed Asp con Jscri... Referenze dei Tag Html Stringhe di connessione via ODBC e Ol... Referenze dei fogli di stile Css Le espressioni regolari in Javascript
HOT LINKS
Servizi per Webmaster E-Commerce News Manager Newsletter Corsi online eBooks PC Guadagna col sito Hosting 20 euro Reg. domini Email gratis FAX via email Tlefonare col PC ADSL Alice ADSL FastWeb