Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
NavigationHighligting auf Onepage
#1
Hallo Community,

zur Zeit arbeite ich an meiner ersten Onepage. Meine Links in der Navigation arbeiten gut und manövrieren die Seite schön "smooth" zu den entsprechenden Ankern. Was mir nicht gelingen will, ist das Highlighting der Links in der NavBar. Wenn ich also auf "Kontakt" klicke, möchte ich, dass die Seite nach unten scrollt (was sie ja tut) und der Link farbig unterlegt wird und der vorherige Link (Standartmäßig "Home") das Highlight verliert.

In wenigen Worten:
Ich möchte die CSS-Klasse des links ändern, wenn ich darauf klicke.

Ich habe schon über Google eine Menge Ansätze gefunden, aber nichts will so recht funzen. 
Eine Möglichkeit habe ich als Code angehängt. Vielleicht bin ich da ja auf der richtigen Spur.

Vielleicht hat ja von euch einer den Denkanstoß Idea  den ich brauche.

LG Buzz 
 
Code:
<script type="text/javascript">
   function highlightCurrentPageLink() {
       var anzHrefs = document.getElementsByTagName("a").length;
       for (var i = 0; anzHrefs - 1 >= i; i++) {
           if (document.getElementsByTagName("a")[i].href == document.location.href) {
               var currentClassName = document.getElementsByTagName("a")[i].className;
               var newClassName = currentClassName.replace(/inactiv/,"activ");
               document.getElementsByTagName("a")[i].className = newClassName;
           }
       }
   }
</script>
Zitieren
#2
Warum nutzt Du nicht ein Framework wie z.B. FullPageJS (http://alvarotrigo.com/fullPage/)? Dort musst nichts selbst basteln, sonder lediglich die Optionen nutzen...
Zitieren
#3
Try fullpageJs it's really helpful
Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste