Ahoj, mám více stránkový web, kde bych chtěl v menu zvýraznit aktivní
položku.
Následující kód mi dobře funguje pro anchory (mujweb.cz/#kontakt), ale
chtěl bych aby reagoval i reagoval na stránku
mujweb.cz/o_mne.html.
Takže když si otevřu stránku mujweb.cz/o_mne.html, chci
aby pokud budu najetý na divu s id="o_mne" bylo v menu
zvýrazněno O mně (rozuměj přidat do menu třídu active),
když přejedu níž na id="kontakt", zvýrazní se kontakt
(kontakt je součást patičky a je společný pro všechny stránky)
(function($) {
"use strict"; // Start of use strict// Smooth scrolling using jQuery easing
$('a.js-scroll-trigger[href*="#"]:not([href="#"])').click(function() {
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
if (target.length) {
$('html, body').animate({
scrollTop: (target.offset().top - 70)
}, 1000, "easeInOutExpo");
returnfalse;
}
}
});
// Scroll to top button appear
$(document).scroll(function() {
var scrollDistance = $(this).scrollTop();
if (scrollDistance > 100) {
$('.scroll-to-top').fadeIn();
} else {
$('.scroll-to-top').fadeOut();
}
});
// Closes responsive menu when a scroll trigger link is clicked
$('.js-scroll-trigger').click(function() {
$('.navbar-collapse').collapse('hide');
});
// Activate scrollspy to add active class to navbar items on scroll
$('body').scrollspy({
target: '#mainNav',
offset: 80
});
// Collapse Navbarvar navbarCollapse = function() {
if ($("#mainNav").offset().top > 100) {
$("#mainNav").addClass("navbar-shrink");
} else {
$("#mainNav").removeClass("navbar-shrink");
}
};
// Collapse now if page is not at top
navbarCollapse();
// Collapse the navbar when page is scrolled
$(window).scroll(navbarCollapse);
// Modal popup$(function () {
$('.portfolio-item').magnificPopup({
type: 'inline',
preloader: false,
focus: '#username',
modal: true
});
$(document).on('click', '.portfolio-modal-dismiss', function(e) {
e.preventDefault();
$.magnificPopup.close();
});
// Floating label headings for the contact form
$(function() {
$("body").on("input propertychange", ".floating-label-form-group", function(e) {
$(this).toggleClass("floating-label-form-group-with-value", !!$(e.target).val());
}).on("focus", ".floating-label-form-group", function() {
$(this).addClass("floating-label-form-group-with-focus");
}).on("blur", ".floating-label-form-group", function() {
$(this).removeClass("floating-label-form-group-with-focus");
});
});
})(jQuery); // End of use strict
Kód je převzatý s jedné bootstrap šablony.
Doufám, že se mi podařilo srozumitelně vyvoslit o co mi jde a někdo
poradí
Zkusil jsem: Zkusil jsem něco málo pokus omyl bez kýženého
úspěchu.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.