Your IP : 216.73.217.62
//JS//
//zaciągam wszystkie linki z danego kontenera
var menuLinks = document.querySelectorAll('.js-menu a');
// menuLinks zwracany jest jako tzw. nodelist, który potraktować można pętlą
// tworzymy kolejne event listenery dla kliknięcia w poszczególną pozycję menu
for (var i = 0; i < menuLinks.length; i++) {
menuLinks[i].addEventListener("click",
function () {
//pobieramy atrybut href z konkretnego linka
//nastepnie z wyniku kasujemy znak #
//wynik tej operacji z kolei jest parametrem metody getElementById
//zaznaczony element jest zapisywany do zmiennej targetobject
targetObject = document.getElementById(
this.getAttribute('href').replace('#', '')
);
//poszukujemy ewentualnie juz podświetlonego elementu
oldTarget = document.querySelector('.js-highlighted');
if (oldTarget !== null) {
//jeśli go wykryjemy- kasujemy z jego spisu klas klasę podświetlającą
oldTarget.classList.remove('js-highlighted');
}
//dla wybranego elementu dodajemy klasę podświetlenia
targetObject.className += 'js-highlighted';
},
false);
}
//jQUERY//
//tworzę metodę dla wszystkich linków w danym kontenerze
$('.jquery-menu a').click(function (e) {
//przechwytuję i zatrzymuję domyślne działanie klikniętego elementu
//dzięki temu link po kliknięciu nie przejdzie do swojego href'a
e.preventDefault();
//pobieram do zmiennej target atrybut href- będzie to mój element docelowego
target = $(this).attr('href');
//pobieram pozycję od góry strony dla elementu docelowego
targetOffset = $(target).offset().top;
//każdy element nie będący elementem docelowym traci klase podświetlającą
$('*').not(target).removeClass('jquery-higlighted');
//do targetu dodajemy klasę podświetlającą
$(target).addClass('jquery-higlighted');
//na koniec dodajemy płynne przejscie do pozycji elementu docelowego
$('html,body').animate({
scrollTop: targetOffset
}, 800);
});