Homepagebau
Dateiversion:
diesen Beitrag diskutieren,
ergänzen, eine Frage stellen

Webring

Schwierigkeit: für Fortgeschrittene

 

Webring-Paket


170 kbyte

Alles was sie brauchen ...


Beschreibung:

Das Webring-Paket umfasst mehrere Tools. Unter anderem Ringlogos, oder Vorlagen für Mails an ihre Mitglieder. Außerdem eine umfangreiche Online-Hilfe und Installationsanleitung. (Deswegen werde ich mich in diesem Artikel darauf beschränken, das Prinzip des Quellcodes zu erläutern.)

Quelltext:

Im Grunde genommen ist ein Webring eine "doppelt verkettete Ringliste". Das ist ein Datentyp, bei dem jedes Element jeweils einen Vorgänger und einen Nachfolger hat. Wir beschränken uns (etwas einfacher) auf ein Array und zwei Funktionen "next()" und "previous()" die als Rückgabewert jeweils den nächsten oder vorherigen Eintrag liefern:

var webring = new Array(); // webring soll die Daten unseres Webrings enthalten
var aktuelleSeite = 0; // das ist die Indexnummer, den die aktuell gewählte Seite im Webring hat

function prev() {

  if (aktuelleSeite == 0) { // erste Seite
    aktuelleSeite = webring.length -1;
  } else {
    aktuelleSeite = aktuelleSeite -1; // oder: aktuelleSeite--;
  };

  return webring[aktuelleSeite];

};

function next() {

  if (aktuelleSeite == webring.length -1) { // letzte Seite
    aktuelleSeite = 0;
  } else {
    aktuelleSeite = aktuelleSeite +1; // oder: aktuelleSeite++;
  };

  return webring[aktuelleSeite];

};

Die Besonderheit einer "doppelt verketteten Ringliste" besteht eben darin, dass der Nachfolger des letzten Eintrags der erste Eintrag ist und der Vorgänger des ersten Eintrags der letzte Eintrag. Also anders formuliert: falls der "definierte Indexbereich" (der Inhalt des Arrays) nach oben oder unten verlassen wird, wieder auf den Beginn bzw. das Ende zurück verwiesen wird.
Kompliziert? Stellen sie sich eine Halskette vor. Jedes Kettenglied entspricht einem Eintrag in ihrem Array. Und jedes davon hat ein nächstes und ein vorhergehendes. Wenn sie den Verschluss als "Start" betrachten, dann ist "vor" dem "Start" das "Ende" und "nach" dem "Ende" wieder der "Start". Auch das ist eine Ringliste.

Auf geht's:

Daraus nun einen einfachen Webring zu machen ist nicht weiter kompliziert.

var webring = new Array('URL1','URL2','URL3');
var aktuelleSeite = 0; // das ist die Indexnummer, den die aktuell gewählte Seite im Webring hat

function prev() {

  if (aktuelleSeite == 0) { // erste Seite
    aktuelleSeite = webring.length -1;
  } else {
    aktuelleSeite--; // entspricht: = aktuelleSeite -1
  };

  window.open(webring[aktuelleSeite], '_blank'); // Seite öffnen

};

function next() {

  if (aktuelleSeite == webring.length -1) { // letzte Seite
    aktuelleSeite = 0;
  } else {
    aktuelleSeite++; // entspricht: = aktuelleSeite +1
  };

  window.open(webring[aktuelleSeite], '_blank'); // Seite öffnen

};

Das war es schon. Jetzt braucht es nur noch einen (wie auch immer gearteten) Knopf zum "blättern" vorwärts bzw. rückwärts durch unsere Liste der Webseiten. Im Prinzip funktionieren ALLE Webringe nach diesem einfachen Prinzip. Egal, wie kompliziert sie im konkreten Fall sind.

Erweitern lässt sich das ganze noch mit Online-Hilfe, es müssen verschiedene HTML-Seiten, ein Formular für An- und Abmeldung geschaffen werden und eine Liste aller angemeldeten Seiten wäre natürlich auch nicht schlecht. Das alles liefern wir ihnen bereits frei Haus in unserem Webring-Paket. Wenn sie also Lust bekommen haben, ihren eigenen Webring aufzubauen, laden sie sich das Skript herunter.

Das könnte ihrer sein:

Beispiele für Layouts
(dem Webring-Paket liegen weitere Beispiele bei)

Beispielseite anzeigen 

 

 

 

PS: Wenn sie unser Webring-Paket einsetzen wollen, würden wir uns über einen Link zu uns freuen.