myRisk e.V. - Forum  »  Tutorials  »  [CODING] Subnavigation erstellen
offline SlicewOw Administrator
09.12.12, 15:26
Eine simple Subnavigation ist enorm wichtig für eine solide Homepage - doch welches Script benutzt ihr?
Hier zeige ich euch ein einfaches aber dafür umso schöneres Script, einfache Installation und eine super Handhabung - auch für andere Benutzer.

Aufgrund von meiner Erkältung dieses Mal kein Videotutorial. Wird nachgereicht.

Installationshinweise
ladet folgende Dateien runter:
- navi.js

Erster Schritt
Entpackt die Datei und speichert sie in dem gleichen Archiv, wie im Archiv. Fügt in eurer index.php folgendes im <head></head> Bereich ein

Quelltext:
1


Zweiter Schritt
Die Main Navigation ist aufgebaut wie eine Liste. Die Stylesheet müsst ihr eigenständig, an euer Design angepasst, erstellen. Den Quelltext könnt ihr hier übernehmen.

Quelltext:
1
         
2   <li><a id="ainfos" class="aktiv" onclick="nav(1);">Information</a></li>
3   
  • Teams
  • 4   
  • Community
  • 5   
  • Mediacenter
  • 6


    Die IDs innerhalb der nav(ID); könnt ihr in der navi.js hinzufügen. Dort könnt ihr weitere Punkte hinzufügen bzw. löschen.
    Die IDs des <a> Tags sind ebenfall in der navi.js änderbar und hinzufügbar. Wenn ihr Bilder als Background setzen wollen, so könnt ihr in den <li></li> Tag eine ID zuordnen und dann via Stylesheet einen Background einbetten.

    Dritter Schritt
    Benutzt am einfachsten die navigation.php - öffnet die navigation.html und ändert den Code.

    Quelltext:
    1
    2   %about_us%
    3   %squads%
    4   %members%
    5   %matches%
    6   %history%
    7


    Hier beachtet bitte, dass die ID der ID entsprechen muss, die in der navi.js erstellt wurde (Default IDs: infoinhalt, teamsinhalt, comminhalt, mediainhalt, miscinhalt). In der Subnavigation, die direkt am Anfang angezeigt werden soll, müsst ihr eine Klasse deklarieren.

    Quelltext:
    1<a id="ainfos" class="aktiv" onclick="nav(1);">Information</a>


    Wie hier, könnt ihr die Klasse auch an anderer Stelle anordnen, je nach Art der Subnavigation.



    Bei Fragen oder Wünschen schreibt bitte, hoffe, ich konnte helfen.


    ---
    Tags:
    webspell 4.2.3a sub subnavigation navigation main div id container menu dropdown anylink anpassen



    Um ein Thema zu eröffnen musst du registriert und angemeldet sein!

    registrieren
    anmelden