JavaScript AutoFootnoter und fester Header am Seitenkopf

[Fußnotennutzer]

Hallo,

ich hoffe, ich bin hier im richtigen Forum mit meiner Frage.

Ich nutze auf meiner Internetseite den Auto Footnoter auf JavaScript-Basis, der hier beschrieben wird. Der funktioniert soweit auch so, wie er soll.

Nun habe ich aber auf allen Seiten einen per CSS als position:fixed am Seitenkopf. Dies führt nun dazu, dass beim Zurückspringen von der Fußnotenerläuterung am Seitenfuß in den Text die Fußnote standardmäßig hinter dem Header verschwindet. Normalerweise würde ich das per CSS so lösen, dass ich dem Anker im Text folgende Merkmale zuweise:

a.anchor {
    display:block;
    position:relative;
    top:-100px; 
    visibility:hidden;
}

Die -100px sind dabei dann der (hier exemplarische) Offset, der beim Zurückspringen von der Fußnotenerläuterung in den Text auf den oberen Seitenrand angewendet wird. Für die Fußnotenanker im Text funktioniert diese Lösung allerdings nicht so wie gewünscht. Die Fußnoten werden statt im Text in einer Reihe untereinander am linken Seitenrand angezeigt. Also habe ich das JS-Fußnotenskript so modifiziert, dass ich den Fußnotenankern einen leeren Hyperlink beigebe (...<a class="fnheader"></a>... ), dem ich dann folgende CSS-Merkmale zuweise:

a.fnheader {	
    position:relative;
    margin-top:-150px;
    padding-top:150px;
    visibility:none;
}

Das funktioniert dahingehend, dass ich nun ohne Probleme von den Fußnoten im Text zu den Erläuterungen am Seitenfuß und umgekehrt springen kann. Aber: Bedingt durch die padding-top:150px vergrößert sich der anklickbare Linkbereich nach oben hin. Hierzu mal ein Screenshot, in dem ich eine 1px border red ergänzt habe, um den per padding definierten Bereich sichtbar zu machen:

Wie man erkennen kann, überdeckt das padding-top von Fußnote 86 auch die Fußnote 85. Wenn ich nun Fußnote 85 auswählen will, komme ich zur Erläuterung von Fußnote 86.

In den Fußnotenerläuterungen am Seitenfuß sieht das ganze natürlich dann genauso aus, d. h. wenn ich hier die 86 auswähle, komme ich zur Fußnote 93 im Text, da sich das padding-top der 93 bis auf die 86 ausdehnt. Ich hoffe, das kann man soweit verstehen …

Nun frage ich mich, wie ich dieses Problem lösen kann.

Es läuft ja anscheinend alles darauf hinaus, dass ich entweder einen anderen Weg wählen muss, um das Problem mit dem festen Header zu umgehen, oder eben den anklickbaren Bereich der Fußnotenlinks verkleinern muss. Letzteres halte ich für nicht möglich (jedenfalls weiß ich auch nach längerer Internetrecherche nicht, wie ich das machen sollte, ohne den padding-top zu verkleinern).

Leider sehe ich auf beiden Wegen derzeit daher keine wirkliche Lösung. Daher wäre ich hier für Lösungsideen oder Anregungen dankbar.