Tutorials

Java-Script News Ticker Tutorial

Einloggen
Benutzername:
Passwort:

Passwort vergessen?
Kostenlos
Anmelden
anzeigen
Java-Script News Ticker
.

10147 - snk - 30.09.2008 20:25 Uhr - Version: 2 - - verlinken als BB-Code


Hier mal ein kleines Tutorial für einen simplen Java-Script News Ticker zum einbinden auf eure Homepages. Er ist schnell durchschaut und gut anpassbar - also viel Spass damit Smily NR:7

Zuerst wird im Head-Bereich des HTML Dokuments folgendes Script eingefügt:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<script language="JavaScript">
<!-- Start
var newslist=new Array();
var cnt=0;     // Aktive News
var curr = "";
var i=-1;     // Angewählter Buchstabe

newslist[0]=new Array("Beispielmeldung 1")
newslist[1]=new Array("Beispielmeldung 2")
newslist[2]=new Array("Beispielmeldung 3")
newslist[3]=new Array("Beispielmeldung 4")

function newsticker()
{
        // Nächster Buchstabe der aktiven News
        if (i < newslist[cnt][0].length - 1)
        {
                i++;
                temp1 = newslist[cnt][0];
                temp1 = temp1.split('');
                  curr = curr+temp1[i];
                temp2 = newslist[cnt][1];
                  mtxt.innerHTML = ""+curr+"_";
                  setTimeout('newsticker()',35)
                return;
        }

        // Nächste News
        i = -1; curr = "";
        if (cnt<newslist.length-1)
                cnt++;
        else
                cnt=0;
        setTimeout('newsticker()',3000)     // Pause zwischen den News

}

//  Ende -->
</script>


Das Script wird dann noch zusätzlich im einleitenden Body-Tag aktiviert:

1
<body onLoad="newsticker();">


Nun muss der Newsticker nur noch in einem definierten Textbereich angesteuert werden, er kann durch CSS-Styles natürlich noch zusätzlich an Eure Seite angepasst werden:

1
<Span Id="mtxt" style="font-weight: bold; color: #FF0000;"></Span>


Dürfte also eigentlich keine grossen Probleme damit geben...
MfG snk

Mitglieder-Kommentare


#2 von Habbohigh
Hmm, nicht schlechte Idee.
#1 von npage-club
Genau das habe ich gebraucht! Danke!!!

Nur registrierte Mitglieder könnten einen Kommentar schreiben.

Melde dich doch ganz einfach an, es ist kostenlos. :-)