Hier der JavaScript-Code
<script type="text/javascript">
(function($) {
$(document).ready(function() {
var navChildren = $("#top-menu li").children();
var aArray = [];
for (var i = 0; i < navChildren.length; i++) {
var aChild = navChildren[i];
var ahref = $(aChild).attr('href');
aArray.push(ahref);
}
$(window).scroll(function() {
var windowPos = $(window).scrollTop();
var windowHeight = $(window).height();
var docHeight = $(document).height();
for (var i = 0; i < aArray.length; i++) { var theID = aArray[i]; var secPosition = $(theID).offset().top; secPosition = secPosition - 135; var divHeight = $(theID).height(); divHeight = divHeight + 90; if (windowPos >= secPosition && windowPos < (secPosition + divHeight)) {
$("a[href='" + theID + "']").parent().addClass("active");
} else {
$("a[href='" + theID + "']").parent().removeClass("active");
}
}
});
});
})(jQuery);
</script>Der JS-Code wird hier eingetragen
Und hier das CSS für die aktiven Links
#top-menu .active a{
color: #c3095f!important;
}
#top-menu .active a:after{
content: '';
border-bottom: 2px solid #c3095f;
display: block;
width: 100%;
position: relative;
top: 8px;
}
Der CSS-Code wird hier eingetragen
