Frage von GameByUs, 17

Unterseite soll wie eine Sidebar ins Bild kommen. Wie soll ich das erstellen?

Möchte eine Seite erstellen wo die navigation in der Mitte der page ist - Die navigation füllt 1 komplette seite aus, wenn man jetzt auf ein Menübutton drückt sollte die dementsprechende Seite von links nach rechts in das Bild "faden" (oder auch Slideeffekt). Sie sollte aber nur ca 75% bis 80% Überdecken sodass Rechts einen kleinen Rand bleibt womit man beim Klicken wieder auf die Homepage kommt -> Also die Navigation. Wäre suuper nett wenn ihr mir bei diesem kniffligen Problem helfen könnt... Liebe Grüsse, Jeannot. P.S: Habe bis jetzt kein ähnliches Theme gefunden, falls ihr eins habt könntet ihr das doch verlinken, wäre meegga nett :)

Antwort
von ilovetoro, 5

Google mal nach "scrollTo.js" und "localscroll.js". Beides sind jquery-Dateien und in kompriemierter Form erhältlich (min). Diese brauchst du um den scroll-Effekt einer Seite zu verwirklichen (Slide-Effekt).

Am einfachsten ist es dann den layout der gesamten Website (also alle "Seiten") in einer einzigen HTML-Datei zu erstellen - Die einzelnen Seiten werden in sections unterteilt ... und beim anklicken eines Menüpunktes scrollt es zu dem entspechendem section, wärend die anderen sections nicht sicht bar sind.

Hier ein Beispiel, wahrscheinlich nicht so wie du es gerne möchtest, aber es sind Vorlagen die du kostenlos runterladen kannst:
http://www.website-bauen.de/demo-template\_slide-left-right\_01/index.html
 ... und wenn du auf der Homepage noch etwas suchst, findest eine weitere Vorlage zum download, welche links<>rechts scrolt, mit dem Menu horizontal oben.


Kommentar von ilovetoro ,

Sorry falls der link nicht funktioniert:
www.website-bauen.de/templates-kostenlos.html
dort findest du die besagten Vorlagen.

Antwort
von abbrechen, 1

Am elegantesten ist es mit den js-Plugins vom Kollegen unter mir, aber was auch recht simpel und mehr die Hau-Drauf-Methode wäre, ist es mit css und jQuery selbst umzusetzen.

Angenommen es sind vier Pages, dann schiebst du sie via css komplett nach außen und setzt overflow: hidden für das mittlere Fenster. Via jQuery schiebst du sie dann ins Bild, in dem du den entsprechenden Wert in den css-Eigenschaften änderst. Wird vermutlich mit margin klappen.
Sollten es mehr als vier Pages sein, lagerst du sie halt mit z-index und position:absolut übereinander. Kannst sie dann auch problemlos an den Ecken positionieren, statt nur straight auf der x -bzw. y-Achse.

Antwort
von regex9, 8

Meinst du sowas: http://ceevee.apollo13.eu/?

Kommentar von GameByUs ,

Ja genau aber wenn man dann auf ein Menüpunkt klickt soll ein neuer Layer geöffnet werden der das Menü 80 % oder so überdeckt das nur noch ein 20% Spalt bleibt womit man beim klicken auf den streifen wieder zurück zum menü kommt (Aber ja wie eine Sidebar als "richtige" Site)

Kommentar von regex9 ,

Keine passende Antwort gefunden?

Fragen Sie die Community