zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Fixe Navigation nach Full-Screen Header

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 01.12.2015, 17:15
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 10.06.2010
Beiträge: 19
irenehofer befindet sich auf einem aufstrebenden Ast
Standard Fixe Navigation nach Full-Screen Header

Auf einer One-Page Seite verwende ich zum Einstieg einen Full-Screen Header mit folgendem Code:

Code:
#hero {
   background-image:url(../images/hero.jpg);
   background-size:cover;
   position:relative;
   height:100vh;
}
Im Anschluss an diesen Header folgt die Navigation, welche dann aber mitscrollen soll. Also die Navigation soll nach der Gesamthöhe des Bildschirms mitscrollen. Irgendwelche Hinweise?
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 01.12.2015, 17:21
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 02.01.2012
Beiträge: 485
dazzle89 wird schon bald berühmt werden
Standard

Ich würde mit Javascript die Höhe des Browserfensters und die Scrollposition abfragen. Dafür findest du genug Scripte bei Google.

Und sobald man bis unter das Bild gescrollt hat, könntest du der Navigation z.B. eine Klasse geben, die dann position: fixed hat.
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
fixe navigation, fullscreen, header, hero

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Ausrichtung Kalender greece4u CSS 20 14.05.2012 14:32
Navigation ist nicht mittig Schokokrapfen CSS 29 20.09.2011 00:19
Problem mit Navigation safari CSS 12 20.04.2011 12:11
Float-Problem? mischaef CSS 33 20.10.2010 17:20
Javascript UL Navigation im IE6 ven CSS 7 29.04.2008 16:29


Alle Zeitangaben in WEZ +2. Es ist jetzt 07:19 Uhr.