Home + Webmaster + Script + Javascript + Effetti su testo + Newsticker Esempio 2

Newsticker Esempio 2

Consente di creare un news ticker dall'effetto macchina da scrivere, la particolarità di questo script è che permetterà all'utente di leggere le news anche se ha javascript spento. Vedi anche Creare Newsticker.

Download codice sorgente

<html>
<head>
<script type="text/javascript">

function ticker_ie(id, tempo, pause) {
		tabelle = document.getElementById(id);
		comment_l = tabelle.firstChild.childNodes.length;
		comment = new Array();
		for(i=0; i<comment_l; i++) {
			comment.push(tabelle.firstChild.childNodes[i].childNodes[1].firstChild.firstChild.nodeValue);
		}
		for(i=1; i<comment_l; i++) {
			tabelle.firstChild.removeChild(tabelle.firstChild.childNodes[1]);
		}
		meldung_nr = 0;
		buchstabe_nr = 0;
		tempo_verlauf = tempo;
		pause_verlauf = pause;
		ticker_verlauf();
	}

function ticker_moz(id, tempo, pause) {
		tabelle = document.getElementById(id);
		comment_l = tabelle.childNodes[1].childNodes.length;
		comment = new Array();
		for(i=0; i<comment_l; i+=2) {
			comment.push(tabelle.childNodes[1].childNodes[i].childNodes[3].childNodes[1].firstChild.nodeValue);
		}
		for(i=1; i<comment_l; i++) {
			tabelle.childNodes[1].removeChild(tabelle.childNodes[1].childNodes[1]);
		}
		comment_l = comment_l / 2;
		meldung_nr = 0;
		buchstabe_nr = 0;
		tempo_verlauf = tempo;
		pause_verlauf = pause;
		ticker_verlauf();
	}

function ticker_verlauf() {
		buchstaben_l = comment[meldung_nr].length;
		if(buchstabe_nr == buchstaben_l) {
			meldung_nr++;
			buchstabe_nr = 0;
		}
		if(meldung_nr == comment_l) {
			meldung_nr = 0;
		}
		if(buchstabe_nr == buchstaben_l - 1) {
			tempo_pause = pause_verlauf;
		} else {
			tempo_pause = tempo_verlauf;
		}
		buchstabe_nr++;
		if(browser == "ie") {
			tabelle.firstChild.firstChild.childNodes[1].firstChild.firstChild.nodeValue = comment[meldung_nr].substr(0, buchstabe_nr);
		} else {
			tabelle.childNodes[1].firstChild.childNodes[3].childNodes[1].firstChild.nodeValue = comment[meldung_nr].substr(0, buchstabe_nr);
		}
		window.setTimeout("ticker_verlauf()", tempo_pause);
	}

function ticker(id, tempo, pause) {
		if(navigator.appName == "Microsoft Internet Explorer") {
			browser = "ie";
			ticker_ie(id, tempo, pause);
		} else {
			browser = "moz";
			ticker_moz(id, tempo, pause);
		}
	}

</script>
</head>

<body onload="ticker('news', 25, 2500)">
<table id="news">
	<tr>
		<td style="vertical-align:top">
			<p>·</p>
		</td>
		<td style="width:200px">
			<p>Hier steht die erste Nachricht von mehreren, die nacheinander gezeigt werden.</p>
		</td>
	</tr>
	<tr>
		<td style="vertical-align:top">
			<p>·</p>
		</td>
		<td style="width:200px">
			<p>Das ist die zweite Nachricht von mehreren, die kürzer oder auch länger sein kann.</p>
		</td>
	</tr>
	<tr>
		<td style="vertical-align:top">
			<p>·</p>
		</td>
		<td style="width:200px">
			<p>Und noch eine Nachricht, es ist die dritte.</p>
		</td>
	</tr>
</table>
</body>
</html>

Compatibilità: MsIE | Netscape

Javascript

Altre risorse:
Libri Javascript | Manuale Javascript

E-Learning

E-Learning Scopri il catalogo dei corsi, da quello per webmaster a quelli di programmazione avanzata!

MrW Corsi Corsi di Informatica online 24 su 24. Corsi completi, download, quiz e blocco appunti.

Javascript e DHTML Corso per imparare lo scripting lato client con Javascript adatto a qualsiasi livello di esperienza.

Altre risorse su 4youGratis.it

© 4youGratis.it 2004-2024 | 4youGratis.de | powered by GTWeb

Contattaci | Pubblicità | Segnala un link | Disclaimer

Questo sito utilizza i cookie. Cliccando su OK o proseguendo nella navigazione acconsenti all'utilizzo dei cookie.
Per maggiori info: Dati di navigazione