In einem Kommentar zum Artikel Newsticker with jQuery and three lines of Code wurde gefragt, ob es möglich sei, mehrere jener Ticker auf einer Seite darzustellen.
Die Antwort lautet: Natürlich ist das möglich. Wie immer gibt es auch hier mehrere Varianten:
- Einfach, aber etwas unbequem: Die Nutzung von iframes. Jeder Ticker würde als einzelne Seite via iframe eingebunden. In der Praxis will man Derartiges aber eigentlich nicht…
- Die zweite Möglichkeit: Die newsticker()-Funktion könnte so modifiziert werden, dass die relevanten Code-Zeilen verdoppelt würden. Die jeweiligen Ticker-IDs würden dabei einzeln selektiert. Dies ist ebenfalls einfach, aber es entstünde redundanter Code, was nicht nur wenig elegant ist, sondern auch den Pflegeaufwand erhöht.
- Als dritte Variante bietet es sich an, die ID des Ticker-Elements der newsticker()-Funktion als Parameter zu übergeben.
Die zuletzt genannte Lösung sieht im Code wie folgt aus:
<script type="text/javascript">
function newsticker(ticker)
{
last = $('ul#' + ticker + ' li:last').hide().remove();
$('ul#' + ticker).prepend(last);
$('ul#' + ticker + ' li:first').slideDown("slow");
}
$(document).ready(function(){
var speed = 700;
var pause = 3500;
interval = window.setInterval('newsticker("listticker")', pause);
interval = window.setInterval('newsticker("listticker2")', pause);
});
</script>
Hierbei ist zu beachten, dass die newsticker()-Funktion nun ausserhalb der jQuery Document Ready Initialisierung steht. Ansonsten ist diese Funktion beim Aufruf von setInterval unbekannt.
Getestet mit Firefox 3.5, und natürlich gibt es auch das vollständige Beispiel zum Download.
