Anker: Scrollen nach oben nicht mehr möglich?

[Julian Hofmann]

Hallo.

Bin gerade auf ein merkwürdiges Verhalten gestoßen bei Sprungmarken/Ankern:

Wir haben ein Lexikon, das auf einer Seite zig Begriffe erklärt. Jeder Begriff beginnt mit einem Anker der Form <a id="c123"></a>, gefolgt von einer h2-Headline und der Erklärung - alles XHTML-konform.
Springt man aber nun einen Anker an, so ist kein Scrollen nach oberhalb des Ankers möglich. Der Scrollbalken steht an oberster Position der Scrolleiste, im Quellcode der Seite ist jedoch die gesamte Seite vorhanden udn viiiel inhalt oberhalb vorhanden.
Das Verhalten zeigt sowohl FF3, Safari als auch IE7. Es ist auch egal, ob der Sprung via absoluter URL erfolgt oder "nur" innerhalb der Seite.

Hatte jemand schonmal ein ähnliches Problem und kann mir helfen?

Grüße aus Würzburg
Julian

[miku]

Hi,

Wir haben ein Lexikon, das auf einer Seite zig Begriffe erklärt. [...]
Hatte jemand schonmal ein ähnliches Problem und kann mir helfen?

kann man sich das ankucken oder ist das im Intranet.

Grüße

[Julian Hofmann]

Hallo.

kann man sich das ankucken oder ist das im Intranet.

Liegt momentan noch am hausinternen Entwicklungsserver... Hab die relevante Seite mal aus FF heraus gespeichert, etwas abgespeckt und anonymisiert unter
http://www.julian-hofmann.net/selfforum/183767/werkstoffe.html bereitgestellt.

Grüße aus Würzburg
Julian

[Patrick Andrieu]

Hallo Julian!

http://www.julian-hofmann.net/selfforum/183767/werkstoffe.html bereitgestellt.

Ich dachte zuerst daran, dass JavaScript dazwischen funkt, also im Safari JavaScript deaktiviert, aber nein, es lag nicht daran.

Styles deaktiviert und siehe da: Scrollen ist wieder möglich.

Such den Fehler also im CSS!

Viele Grüße aus Frankfurt/Main,
Patrick

[Julian Hofmann]

Hallo Patrick.

Such den Fehler also im CSS!

Danke soweit. Die Vermutung hatte ich schon. Nur wo soll man da beginnen? Das CSS ist valide und meiner Meinung nach auch rund um den Anker und seine Container logisch. Nachdem das Verhalten nur auftritt, wenn man einen Anker anspringt, dürfte es ja eigentlich nicht am CSS liegen (da das ja unabhängig vom Anker geladen wird).
Mir fehlt gerade einfach der Ansatz, wo/warum hier Sand im Getriebe sein _könnte_.

Grüße aus Würzburg
Julian

[Patrick Andrieu]

Hallo Julian!

Mir fehlt gerade einfach der Ansatz, wo/warum hier Sand im Getriebe sein _könnte_.

Ich werde mich bestimmt nicht in vier fremde CSS reinarbeiten wollen, aber beobachte folgenden Effekt:

Seite aufrufen und bis unten scrollen.
Dann Link mit dem Anker klicken, und wieder bis nach unten scrollen...

Wie lauten die Angaben für html und body? Ich tippe drauf, der eine ist auf 100%, der andere nicht... vielleicht noch overflow:hidden irgendwo?

Viele Grüße aus Frankfurt/Main,
Patrick

[Julian Hofmann]

Hallo Patrick.

Ich werde mich bestimmt nicht in vier fremde CSS reinarbeiten wollen, aber beobachte folgenden Effekt:

Kann ich verstehen und hatte ich auch nicht unbedingt erwartet. Danke aber für die Beobachtung (War mir auch schon aufgefallen).
Interessant wäre ein Denkanstoß, warum ein Browser CSS plötzlich anders interpretiert, wenn ein Anker an der URl hängt. Ich bin normal jemand, der auch verstehen will, warum etwas so ist, wie es ist - und nicht nur nach einem Lösungsweg oder Alternative sucht. Denn komisch ist das Verhalten ja wirklich, oder?

Wie lauten die Angaben für html und body? Ich tippe drauf, der eine ist auf 100%, der andere nicht... vielleicht noch overflow:hidden irgendwo?

Ja, wobei auf demgleichen CSS einige Sites bei uns aufbauen ohne die Probleme zu haben.
Letztlich funktioniert es jetzt nach zig kleineren Änderungen am CSS.

Danke Patrick für die Begleitung bis zur Lösung und die Tipps.

Grüße aus Würzburg
Julian

[foomaker]

Hallo Julia,

...Jeder Begriff beginnt mit einem Anker der Form <a id="c123"></a>...

Ich kenne den Anker nur mit dem Attribut name="...", also <a name="c123"></a>.
Vielleicht ist das ja der Grund.

Gruß vom foomaker

[Julian Hofmann]

Hallo foomaker.

Ich kenne den Anker nur mit dem Attribut name="...",

Das name-Attribut ist in XHTML als deprecated eingestuft und als  Fragmentbezeichner soll das id-Attribut verwendet werden. (http://www.websitedev.de/xhtml/xhtml1/#guidelines)

Nichtsdestotrotz habe ich auch schon die name-Variante probiert und auch name und id - ändert aber nichts am Verhalten. Auch eine Verlagerung von id in die <h2 id="c123"> ändert nichts.

Aber danke für Deinen Hinweis. Manchmal sind's ja doch genau solche Kleinigkeiten, über die man stolpert.

Grüße aus Würzburg
Julian

[Patrick Andrieu]

Hallo foomaker!

Ich kenne den Anker nur mit dem Attribut name="...", also <a name="c123"></a>.

Na jetzt nicht mehr ;)

Viele Grüße aus Frankfurt/Main,
Patrick

[Gunnar Bittersmann]

@@Julian Hofmann:

Jeder Begriff beginnt mit einem Anker der Form <a id="c123"></a>, gefolgt von einer h2-Headline

Warum das? Die 'a'-Elemente sind völlig überflüssig. Gib den 'h2'-Elementen die IDs: <h2 id="c123">Lorem ipsum</h2>[/code]

Springt man aber nun einen Anker an, so ist kein Scrollen nach oberhalb des Ankers möglich.

Cannot reproduce.

Live long and prosper,
Gunnar

[Julian Hofmann]

Hallo.

Warum das? Die 'a'-Elemente sind völlig überflüssig.

Weil es so aus dem CMS (TYPO3) kommt :-) Und da nicht zwangsläufig jedes Inhaltselement (d.h. jede Beschreibung) eine Überschrift haben muss, macht das auch durchaus halbwegs Sinn.

Gib den 'h2'-Elementen die IDs: <h2 id="c123">Lorem ipsum</h2>[/code]

Das hatte ich auch probiert - ändert aber leider nichts am Verhalten.

Grüße aus Würzburg
Julian