Forum - Wechselnde, durchlaufende und verlinkte News Ticker

Forum → XOBOR-Foren und Homepages → Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Fragen & Antworten → Wechselnde, durchlaufende und verlinkte News Ticker

Hier sehen Sie Beitr�ge zu den einzelnen Themen

Seite 1 von 3 � Seite 1 2 3 Seite �

Themen-Einstellungen Thema

Thema abonnieren

Thema drucken

Bereich wechseln

Start Willkommen! Ank�ndigungen & Termine, wichtige News! Stellen Sie Ihr eigene Webseite vor! Betriebssystem MS Windows Betriebssystem MS Windows 10, 8.1, 8 und 7 - Tricks & Tipps MS Windows 10, 8.1, 8 und 7 - Fragen & Antworten �rger mit Ihrem PC? �rger mit dem PC - Vorbeugung und Hilfe �rger mit dem PC - Fragen & Antworten Fragen zu DSL, VDSL, LTE und anderen Netzempfangsarten XOBOR-Foren und Homepages Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Hilfe, Tricks & Tipps Alles f�r Ihr eigenes Forum oder Ihrer Webseite - Fragen & Antworten Das neue Template Xobor (v6) Energieerzeugung im neuen Zeitalter - Revolution�r! Videos und Webseiten zur Freien Energie Wasserstoff - Energietr�ger der Zukunft. Die besten Links Empfehlenswerte und interessante Links! Link - Suche Verschiedenes Faszinationen & Unglaubliches! Tricks & Tipps f�r Smartphones und iPhones Lob, Kritik & Verbesserungsvorschl�ge Spiel & Spa�, Witz & gute Laune! Spiritualit�t, Seele, New Age, Yoga, Gesundheit Alles, was noch so �brig bleibt Bannertausch Wie funktioniert der Bannertausch? Bannerrotation und Bannerwechsel

#1 | Wechselnde, durchlaufende und verlinkte News Ticker datum

23.10.2015 21:54 (zuletzt bearbeitet: 25.12.2015 23:23)

Magister

Informationen anzeigen

Hi

Hat sich erledigt, habe eine Lösung gefunden!

Ich habe einen guten Ticker gefunden.
Läuft sehr gut.
Eines stört mich aber ein bißchen.
Bei unterschiedliche Länge von Meldungen, sind die Kurzen nicht mittig.
Kann man das so verändern, das der Text immer mittig ist?

Hier mal der Code:

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
40
41
42
43
44
45
46
47
48
49
50
51
52
 
<!DOCTYPE html>
<html>
<head>
<title>News Ticker</title>
</head>
 
<body onLoad="newsticker();">
 
<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("Unter 'News CB-Funk' sind Neuigkeiten über den '2.Osna Radio Activity Day' Contest zu finden!")
newslist[1]=new Array("Teilnahmebedingungen siehe Contest")
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()',150)    //Laufspeed
                return;
        }
 
        // Nächste News
        i = -1; curr = "";
        if (cnt<newslist.length-1)
                cnt++;
        else
                cnt=0;
        setTimeout('newsticker()',5000)     // Pause zwischen den News
 
}
 
//  Ende -->
</script>
 
<span id="mtxt" style="font-weight: bold; color: #FF0000; font-family: Baskerville Old Face; font-size: 14pt"></span>
 
</body>
</html>
 

Schlie�en

Thema abonnieren Forum �bersicht Letzte Beitr�ge

Antworten

#2 | Wechselnder News Ticker mit Web-Links und Mittenposition datum

24.10.2015 18:54 (zuletzt bearbeitet: 25.12.2015 23:25)

Wolfgang

Administrator

Informationen anzeigen

Wechselnder News Ticker mit Web-Links und Mittenposition
Aktualisiert 26.10.2015

Hallo Magister,
das Script gefällt mir sehr gut!

Was der Ticker bereits kann:

Mehrere Ticker-Nachrichten sind möglich.
Pausen zwischen den Nachrichten und die Schnelligkeit des Tickers sind einstellbar!
Der Ticker wiederholt seine Nachrichten, fängt wieder von vorne an.
Die Ticker-Nachrichten sind über "style" formatierbar!

Ich habe das Script etwas erweitert, wodurch folgende zusätzliche Funktionen hinzu gekommen sind:

Jede Ticker-Nachricht kann verlinkt werden.
Der Ticker wird mittig angeordnet und startet trotzdem linksseitig!
Kurze oder lange Ticker-Nachrichten bleiben zentriert!
Die Breite des Textfeldes bleibt gleich!
Jede Nachricht kann einzeln formatiert werden!
Grundformatierung über CSS

Zu besseren Übersicht das komplette HTML-Script:

Auf folgendes ist zu achten:

Der Ticker wird über einen Body-Eintrag "onLoad" (Zeile 7) geladen.
Script und Ausgabe des Tickers findet Platz im "Body". Die Formatierungen unter "<style>...</style>" (Zeile 7-30), können auch in die vorhandene CSS eingetragen werden!
Bei vorhandenen onLoad-Eintrag, erweitern (z.B.: <body onLoad="newsticker(); xyzScript();">)
Im Ticker-Text müssen Anführungszeichen (") gegen Auslassungszeichen (') ersetzt werden.
In den Ticker-Zeilen (Zeile 44-47) sind jeweils 3 Informationen durch Anführungsstriche und Kommata getrennt --> newslist[0]=new Array("Text","Format","Link");
Im ersten Teil der Ticker-Zeile wird der Text eingegeben, ohne Anführungszeichen!
Im zweiten Teil der Ticker-Zeile kann man die Ticker-Nachricht formatieren! Wichtig ist hier die Angabe der Breite! Sie sollte so gewählt werden, dass kein Umbruch der Nachricht einsteht! Die Breite ist für die Zentrierung notwendig!
Im dritten Teil der Ticker-Zeile wird die Link-Adresse eingetragen
In Zeile 62 kann die Geschwindigkeit des Tickers eingestellt werden.
In Zeile 72 kann die Pause zwischen den Nachrichten bestimmt werden.
In Zeile 7-32 kann die Tickernachricht für die CSS beliebig formatiert werden!
Zeile 25-29 bestimmt den Hintergrund der Nachricht. Ist nicht immer notwendig!
Zeile 25 bestimmt die Gesamthöhe der Ticker-Nachricht. Ist nur notwendig, wenn unterschiedliche Schriftgrößen genutzt werden. Hierdurch wird ein Höhensprung der Webseite vermieden!
Zeile 19 bestimmt die Gesamtlänge des Textfeldes
Die Hover-Farbe wird in Zeile 15 bestimmt.
Wird nur Text, ohne zusätzliche Breitenbestimmung und Links im Ticker abgebildet, sieht die "newList-Zeile" (44-47) wie folgt aus: newslist[0]=new Array("Nachricht..........","","")

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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
 
<!DOCTYPE html>
<html>
<head>
<title>Ticker</title>
 
<style type="text/css">
.mtxt{
text-align:left;
}
.mtxt a {
text-decoration:none;
color: #eeeeee; 
}
.mtxt a:hover {
color:#ffff00;
}
 
#mtxt{
width:750px; /*Gesamtlänge des Textfeldes*/
font-weight: bold; 
color: #000000; 
font-family: Baskerville Old Face; 
font-size: 14pt;
 
/*height:30px;*/
background-color:#000090;
padding:5px 0px 5px 20px;
border-radius:9px;
border: 6px double #777777
}
</style>
 
</head>
 
<body onLoad="newsticker();"> 
 
<script language="JavaScript"> 
// Tickereinstellungen
var newslist=new Array(); 
var cnt=0;  // Auswahl des Start-Tickers, hier newlist[0]
var curr = ""; 
var i=-1;	
 
newslist[0]=new Array("+++ Neue Weltzeituhr mit JQuery-Script, Datumausgabe und Localzeit +++","width:640px;","https://www.hilfe-tricks-tipps.de/t861f31-Weltzeituhr-Verschiedene-Zeiten-anzeigen.html#msg1898")
newslist[1]=new Array("+++ Meine komplette Forum-Iconbar zum herunterladen +++","width:540px","https://www.hilfe-tricks-tipps.de/t916f31-Meine-komplette-Forum-Iconbar-zum-herunterladen.html#msg2077")
newslist[2]=new Array("+++ Formatierbare Tooltipps +++","width:330px","https://www.hilfe-tricks-tipps.de/t168f31-Formatierbare-Tooltipps-oder-Quickinfos-in-Forumbeitraegen.html#msg300")
newslist[3]=new Array("+++ Spenden-Button fürs Forum +++","width:330px !important;","https://www.hilfe-tricks-tipps.de/t720f31-Spenden-Button-fuers-Forum-einrichten.html")
 
function newsticker() { 
 
if (i < newslist[cnt][0].length - 1) 
{ 
i++; 
temp1 = newslist[cnt][0];	
temp1 = temp1.split('');	
curr = curr+temp1[i]; 
temp2 = newslist[cnt][2];	
temp3 = newslist[cnt][1];
mtxt.innerHTML = "<div class='mtxt' style='"+temp3+"'><a href='"+temp2+"'>"+curr+"_</a></div>"; 
 
//Ticker-Geschwindigkeit
setTimeout('newsticker()',150) 
return; 
} 
 
//Pause
i = -1; curr = ""; 
if (cnt<newslist.length-1) 
cnt++; 
else 
cnt=0; 
setTimeout('newsticker()',5000) 
} 
</script>
 
<!-- Anzeige News Ticker --> 
<center>
<div id="mtxt"></div>
</center>
 
</body>
</html>
 

Um diesen Beitrag zu lesen, m�ssen Sie sich anmelden!

Ein kleines Dankesch�n f�r meine Arbeit!

Schlie�en

News Ticker in Aktion: Wechselnder News Ticker mit Web-Links und Mittenposition

Wolfgang

Thema abonnieren Forum �bersicht Letzte Beitr�ge

Antworten

#3 | RE: Wechselnder News Ticker mit Web-Links und Mittenposition datum

25.10.2015 08:51 (zuletzt bearbeitet: 25.12.2015 23:25)

Magister

Informationen anzeigen

Wolfgang
1. Die Schrift soll bei jedem Text die gleiche Größe haben.
2. Die Schriftfarbe, wo kann ich sie ändern?
3. Wenn der Text unterschiedliche Längen hat, ändert sich jedesmal das gesamte Textfeld.
Mal länger mal kürzer, das sieht nicht so schön aus.
Ich habe alles in einer Tabelle, die sich der Größe automatisch anpasst.
Kann man da noch etwas machen?

Edit zu 2: Schriftfarbe habe ich gefunden!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
		<p style="margin-bottom: -20px">&nbsp;</p>
		<table border="4" width="85%" bgcolor="#000000" bordercolorlight="#FFFFFF">
			<tr>
				<td bgcolor="#000000">
<!-- Anzeige News Ticker --> 
<center>
<span id="mtxt"></span>
</center>
 
                                </td>
 
			</tr>
			</table>
				
 

Thema abonnieren Forum �bersicht Letzte Beitr�ge

Antworten

#4 | RE: Wechselnder News Ticker mit Web-Links und Mittenposition datum

25.10.2015 18:38 (zuletzt bearbeitet: 25.10.2015 23:00)

Wolfgang

Administrator

Informationen anzeigen

Hallo Magister,
habe das Script in Beitrag #2 nochmal überarbeitet.
Die Breite des Textfeldes bleibt jetzt gleich!
Unter "News Ticker in Aktion" kann man sehen, wie der News Ticker jetzt funktioniert!

Folgende Änderungen müsstest Du auf Deiner Webseite machen:

1. Änderung

1
2
3
4
5
6
7
8
 

Diese Zeile tauschen: 
 
mtxt.innerHTML = ""+curr+"_";
 
gegen:   
 
mtxt.innerHTML = "<center><div style='text-align:left;width:"+temp2+"'>"+curr+"_</div></center>";
 

2. Änderung
Jetzt brauchst Du nur noch hinter den Nachrichen die ungefähre Breite des Tickers eintragen, sodas kein Umbruch entsteht.

1
2
3
4
5
 

newslist[0]=new Array("++Info's über den 2.Osna Radio Activity Day Contest unter 'News CB Funk!++","650px")
newslist[1]=new Array("++Teilnahmebedingungen findet Ihr unter 'Contest 01.11.15++","500px")
newslist[2]=new Array("++Osna Radio QRV ab 18.00 Uhr MEZ, auf FM Kanal &nbsp;29 (27.295 Mhz)++","600px")
 
 

3. Änderung
Die Breite der Tabelle sollte einen festen Wert haben (Ist nicht zwingend erforderlich)!
Zu beachten: Die Breite des Textfeldes muss immer etwas länger sein, als die längste Nachricht!

1
2
3
4
 

width="64%" gegen z.B.: width="700px" tauschen (längster Text "newslist[0] => 650px")!
 
<table border="4" width="64%" bgcolor="#000000" bordercolorlight="#FFFFFF">
 

Wolfgang