Vánoční nadílka Vánoční nadílka
Vánoční akce! Daruj lepší budoucnost blízkým nebo sobě. Až +50 % zdarma na dárkové poukazy. Více informací
Avatar
maaaca
Člen
Avatar
maaaca:10. října 19:58

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/#kon­takt), 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");
        return false;
      }
    }
  });

  // 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 Navbar
  var 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.

Chci docílit: To už jsem popsal v dotazu...

 
Odpovědět 10. října 19:58
Avatar
maaaca
Člen
Avatar
maaaca:17. října 21:10

Vyřešeno přidáním atributu data-target="#neco" do menu.

 
Nahoru Odpovědět 17. října 21:10
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.

Zobrazeno 2 zpráv z 2.