Hallo, lieber Forumbenutzer. Wir haben in letzter Zeit festgestellt, dass die Kommunikation via Slack viel schneller und zielführender ist als ein Beitrag im Forum. Aufgrund der neuen Möglichkeiten der Kommunikation ist das Forum ein wenig eingeschlafen und weniger Nutzer benutzen das Forum aktiv (trotzdem lohnt es sich evtl. hier nach Lösungen zu suchen oder seine Frage zu stellen).

Wir empfehlen, für deine Fragen/Probleme aktuell (zusätzlich) Slack zu nutzen. Dort sind viele kompetente Benutzer aktiv und beantworten jegliche Fragen, gerne auch von REDAXO-Anfängern! Slack wird von uns sehr intensiv und meistens "rund um die Uhr" benutzt :-)
Selbst einladen kannst Du dich hier: http://redaxo.org/slack/
Ray
Beiträge: 38
Registriert: 9. Okt 2007, 02:14

Containerfehler mit Anker-Navigation

24. Feb 2013, 07:26

Hallo Leute!

Ich habe auf der frischen Seite für eine Naturheilpraxis einen spannenden Anzeigefehler.

Die Seite "Naturheilverfahren" enthält viele Überschriften (mit IDs). Ein Submenü (mit entsprechender #Anker-Navigation) soll die Navigation erleichtern.

Voraussetzung zur Sichtbarkeit des Problems ist, dass der Bildschirminhalt nach dem Klick auf einen Anker-Link recht weit ans untere Seitenende vorstoßt und der Footer sichtbar ist. Scrollt der Benutzer nun nach oben, dann wird der Inhalt des Containers unten abgeschnitten (s. Grafik).
  • Der Fehler scheint unabhängig vom Browser aufzutreten.
  • Die Seite ist CSS und HTML valide.
Vielleicht könnt ihr mir einen Tipp geben, die Container anders anzuordnen oder zu definieren. Da ich meine Kenntnisse Learning-by-Doing erworben habe, fehlt mir vielleicht die richtige Herangehensweise?

Beste Grüße aus Bayern und lieben Dank für die Unterstützung! :)
Dateianhänge
fehler.JPG
Abgeschnittener Footer
fehler.JPG (55.05 KiB) 4523 mal betrachtet

Benutzeravatar
runstop64
Beiträge: 369
Registriert: 23. Okt 2012, 21:34
Wohnort: Hamburg
Kontaktdaten: Website Facebook Twitter

Re: Containerfehler mit Anker-Navigation

24. Feb 2013, 13:59

Moin!

Nimm mal den 'overflow:hidden' aus dem <body>, dann kannst du nachvollziehen, woran es liegt. Bei der Ankernavigation wird der <body> gescrollt, nicht dein #realbody.
Mein ansatz wäre, das Hintergrundbild zu fixieren und den Rest normal scrollen zu lassen. Mit Firebug oder den Entwicklertools der Borwser kannst du die Browser-Reaktionen auf CSS-Änderungen leicht testen.

Viele Grüße,
Daniel
Viele Grüße,
Daniel


studio-ahoi.de | Referenzen | Friends Of REDAXO

Benutzeravatar
RexDude
Beiträge: 2543
Registriert: 22. Apr 2010, 11:24

Re: Containerfehler mit Anker-Navigation

24. Feb 2013, 14:02

Hi,

vorschlag:

das hier rausschmeissen:
- realBody Div
- dein img mit der id=bgImg
- overflow: hidden aus deinem echten body

und das hier rein in deinen echten body tag:

Code: Alles auswählen

background: #fff url("hg-2.jpg") no-repeat center center fixed;
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover;
background-size wird zwar erst ab neuren browser unterstützt, ist aber der eleganteste weg. sonst mal googlen. es gibt auch per js workarounds für ältere browser.

Benutzeravatar
RexDude
Beiträge: 2543
Registriert: 22. Apr 2010, 11:24

Re: Containerfehler mit Anker-Navigation

24. Feb 2013, 14:04

@runstop64: da waren wir wohl zeitgleich dran :)

Benutzeravatar
runstop64
Beiträge: 369
Registriert: 23. Okt 2012, 21:34
Wohnort: Hamburg
Kontaktdaten: Website Facebook Twitter

Re: Containerfehler mit Anker-Navigation

24. Feb 2013, 14:44

RexDude hat geschrieben:@runstop64: da waren wir wohl zeitgleich dran :)
Doppelt hält besser ;)
Viele Grüße,
Daniel


studio-ahoi.de | Referenzen | Friends Of REDAXO

Zurück zu „Sonstiges“