Gästebuch   Impressum

 

>> Startseite    >> Scripting    >> Neu: Textticker / Laufschrift *  
 

Ajax-basierender textticker in Netobjects einfügen

Nachdem der alte Textticker in den neuen Browsern unschön ruckelte und auch unnötige Leerräume zwischen den Meldungen hatte. hab ich mich auf die Suche nach einem neuen weichen Ticker gemacht.

Dieser Ticker läuft von oben nach unten. Die Scriptschnipsel sind klein und überschaubar, da die gesamte Technik und auch die Texte ausgelagert werden. daher benötigen wir neben den Scriptschnipseln eine zusätzliche JS-Datei. Die angezeigten Texte werden in einer TXT-Datei ausgelagert. (das Einbinden dieser Dateien wird hier gezeigt)

 

Vorbereitungen:

Die benötigte JS-Datei gibt es hier - bitte mit rechte Maustaste und speichern unter auf eurer Festplatte ablegen. Die TXT-Dateit erstellen wir selber mit dem Editor und nennen sie tickercontent.txt - sie bleibt erstmal leer.

Für den Ticker benötigen wie zwei Scriptschnipsel, die wir die in verschiedene Bereiche des Seiten-HTML kopieren. Die JS_Datei und die TXT-Datei müssen entweder als Asset eingebunden werden (siehe oben) oder manuell in an die richtige Stelle des local publish-Ordners kopiert werden.

Dieser Schnipsel kommt zwischen die Headtags

wir drücken F9, um das Layout-Eigenschaftenfenster zu öffnen und drücken auf den HTML-Button - es öffnet sich ein Fenster - dort auf den Reiter zwischen den Head-Tags

 


Breite, Höhe, Rahmen, Hintergrund können wir unseren eigenen Wünschen anpassen (siehe unten). Für zusätzliche Änderungen steht eine Formatvorlage (someclass) zur Verfügung.

Dieser Schnipsel kommt per Textfeld oder Zelle an die gewünschte Stelle

html-einfuegenWir ziehen ein Textfeld auf oder klicken in eine Zelle. Zum Einfügen nutzen wir entweder das HTML der erweiterten Werkzeuge oder klicken in der oberen Menüleiste auf Text/HTML einfügen.

 

 


 

Alle Änderungen in der Übersicht:

Im ersten  Scriptschnipsel können folgende Zeilen von uns angepasst werden:

  • #ajaxticker1 //name
  • {
  • width: 200px;  //breite des tickers
  • height: 100px;  //höhe des tickers
  • border: 1px solid black; //rahmeneinstellungen - hier: 1px durchgehend in schwarz
  • padding: 5px; //innenabstand des textes zum rahmen - hier: 5px
  • background-color: #ffffff; //hintergrundfarbe
  • }
     
  • #ajaxticker1 div{ /*IE6 bug fix. Style im  DIV für die gleiche Hintergrundfarbe */
  • background-color: #ffffff;
    }

Im zweiten Scriptschnipsel können folgende Zeilen von uns angepasst werden:

  • var xmlfile="tickercontent.txt" //die txt-datei - liegt hier im html-ordner von nof
  • //verhalten des ajax_ticker
  • //xmlfile, name des tickers, die formatvorlage, zeit bis zum wechsel in millisekunden, fadingübergang
  • new ajax_ticker(xmlfile, "ajaxticker1", "someclass", 3500, "fade")

Möchte man also z.B. die Fadingzeit ändern, ändert man den Wert 3500. Werden die Passagen kopiert und ein neuer name vergeben, können mehrere Ticker auf einer Seite genutzt werden (Auch neue TXT-Datei!!)

Die TXT-Datei


 

Noch eine kleine Hürde: Sonderzeichen und Umlaute

Sonderzeichen und  Umlaute müssen in der TXT-Dateo als echtes HTML eingetragen werden. Zugegeben: das ist umständlich, aber seht es als kleine HTML-Übung ;-) - wer genau hinschaut, kann die Regel schnell erkennen.

ä = ä
Ä = Ä
ö = ö
Ö = Ö
ü = ü
Ü = Ü
ß = ß

Weitere Sonderzeichen findet Ihr hier

fertisch

Gefunden habe ich den Ticker bei http://www.dynamicdrive.com/dynamicindex2/ajaxticker.htm 

 


dieses tutorial

version: alle versionen
Schwierigkeitsgrad: mittel

Neue Tutorials

Suchfunktion einbauen
MLR kopieren
SuMa-Optimierung
Alle Filme wieder online
Weicher Bildwechsler mit Text
Die 2-Minuten-Newsbox
Das erste eigene Buttonset
Datepicker für Formulare
Includieren in NOF
Bildkomprimierung
Publizierungseinstellungen
Assetverwaltung

Content Management für Netobjects Fusion

Inhalte und Bilder ohne NOF aktualisieren
Fusion Content 3

Shop für Netobjects Fusion

Der kleine nahtlose Shop für eure NOF-Projekte
dank php und einer Datenbank ist eure NOF-Datei schlank und alle Daten bleiben bei eventuellen Crashes oder Layoutumstellungen unberührt
NOF-Shop 1.1

Haste mal nen Euro?

Die NOF-Tips sind werbefrei
Wenn die Tutorials geholfen haben, freuen wir uns auf deine kleine Spende via PayPal an paby@paby.de

Online-Support

Werktags: 9.00 - 14.00h
0160 37 87 652
WE oder Abends nach Absprache möglich
Schnelle Hilfe via Online-Tool 1,00 euro/min

Schulungen & Seminare

Online-Schulungen ab 35,00 Euro/Std.

Friendship (suma-hilfe)

Burlesque Korsetts und mehr
Triumed
Lebensfreude-konzept
Sportfotos
Fliegenruten
 

-
Fatal error: Uncaught Error: Call to undefined function ereg_replace() in /kunden/290678_86558/rp-hosting/1/1/web/nof-tips/netobjects_tutorials/textticker_laufschrift_netobje.php:449 Stack trace: #0 {main} thrown in /kunden/290678_86558/rp-hosting/1/1/web/nof-tips/netobjects_tutorials/textticker_laufschrift_netobje.php on line 449