Javascript fehler

[mely]

Hallo Mely

Erstmal sorry, dass ich auf deine andere Frage bisher noch nicht geantwortet habe. ;-)

Hallo, kein Problem :)

Du wolltest wissen, wie ich darauf gekommen bin, dass das Problem mit den von mir genannten Anweisungen zusammenhängen könnte…

Naja, da gibt es nicht viel dazu zu sagen:

• Die zu dem Wert von $target.offset( ).top hinzugezählten ‚+2‘ wurden in deiner Funktion onScroll nicht berücksichtigt und erschienen mir davon abgesehen auch grundsätzlich sinnlos.

• Die else-Anweisung wiederum schien auf den ersten Blick die einzig logische Ursache dafür zu sein, dass das mit der Link-Farbe nicht funktioniert hat, denn in deinem click-Handler hattest du ja die Anweisung $(this).addClass('active') notiert, die eigentlich dafür sorgen sollte, dass der Link auch entsprechend eingefärbt wird. Es musste darum an deinem scroll-Handler liegen, der jedesmal (else), wenn die if-Bedingung nicht greift, automatisch die Klasse (und somit die Farbe) weggenommen hat.

Gerade merke ich, dass das Problem ist zwar behoben, aber dass es neue Problem dadurch entsteht. Und zwar, dass wenn man die Seite neuladet mit F5 die Seite bleibt wo sie war, aber die Linkfarbe springt zu der Start.

Dass die Seite beim Neuladen an der Stelle bleibt wo sie war, dürfte am Browser liegen, der es sich gewissermaßen merkt, bis wohin die Seite gescrollt war. – „It's not a bug, it's a feature!“

Nun hast du aber in deinem HTML die Zeile <a href="#index" class="active">Start</a>, die dafür sorgt, dass zunächst mal der erste Link in deinem Menü eingefärbt ist – was an und für sich auch sinnvoll ist, aber hier nun dazu führt, dass die Position in der Seite nach dem Neuladen mit der Link-Farbe nicht mehr übereinstimmt.

Du könntest nun natürlich erzwingen, dass die Seite nach dem Laden automatisch an den Anfang springt, wenn sie dort nicht schon ist, aber ich glaube es wäre besser, einfach die Farbe der Links entsprechend anzupassen.

Dazu bräuchtest du denke ich im Grunde nur beim Start die Funktion onScroll manuell aufrufen, wobei du diesen Aufruf in deine Handlerfunktion für DOMContentLoaded integrieren könntest:

document.addEventListener('DOMContentLoaded', function ( ) {
  onScroll( ); // <-- manueller Aufruf beim Start
  if (window.innerWidth < 500) {
    var a = document.querySelectorAll('a.fancybox');
    var len = a.length, i;
    for (i = 0; i < len; i += 1) {
      a[i].removeAttribute('class');
      a[i].removeAttribute('href');
    }
  }
});

Habe es natürlich nicht getestet, aber das sollte funktionieren. ;-)

Ich habe die onScroll manuel hinzugefügt, aber iwie ist er wieder nicht ganz richtig. Er springt sogar manchmal in der falsche Stelle z.B wenn ich auf Test4 Linkmenü klicke er springt dahin, macht er aber die Linkfarbe bei Test3 grün. Und er springt immer noch manchmal zu Anfang siehe Linkbeschreibung

Grüße, mely

Viele Grüße,

Orlok