Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [OneScrollPage] Menu nie zgrane z daną pozycją.
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
Slide
Witam wsztystkich i proszę o pomoc.

Obecnie koduję swoją pierwszą stronę typu "One-Page". Mam jednak pewien problem.
Mianowicie menu nie jest zgrane z zakładką która jest obecnie otwarta na stronie.

Link do strony

Zapewne, a raczej na pewno wszystko spowodowane jest tym, że w kodzie js odpowiedzialnym za "przenoszenie" do odpowiedniej zakładki cała zawartość jest przesuwana o 70px, po to, aby właśnie zakładki ustawiały się poprawnie (nie za wysoko) tutaj cały kod pliku:

  1. //jQuery to collapse the navbar on scroll
  2. $(window).scroll(function() {
  3. if ($(".navbar").offset().top > 70) {
  4. $(".navbar-fixed-top").addClass("top-nav-collapse");
  5. $("ul#ulmenu").removeClass("nav-pills nav-stacked span2 rotate");
  6. $("ul#ulmenu").addClass("nav navbar-nav");
  7. $("li#bind1").addClass("collapsed-a");
  8. $("li#bind2").addClass("collapsed-a");
  9. $("li#bind3").addClass("collapsed-a");
  10.  
  11. } else {
  12. $(".navbar-fixed-top").removeClass("top-nav-collapse");
  13. $("ul#ulmenu").removeClass("navbar-nav");
  14. $("ul#ulmenu").addClass("nav-pills nav-stacked span2 rotate");
  15. $("li#bind1").removeClass("collapsed-a");
  16. $("li#bind2").removeClass("collapsed-a");
  17. $("li#bind3").removeClass("collapsed-a");
  18. }
  19. });
  20.  
  21. //jQuery for page scrolling feature - requires jQuery Easing plugin
  22. $(function() {
  23. $('.page-scroll-active a').bind('click', function(event) {
  24. var $anchor = $(this);
  25. $('html, body').stop().animate({
  26. scrollTop: $($anchor.attr('href')).offset().top - 70
  27. }, 1500, 'easeInOutExpo');
  28. event.preventDefault();
  29. });
  30. });
  31.  
  32. $('.carousel').carousel();


Wchodząc na stronę którą podałem na początku i klikając pozycję "OFERTA" widać, że menu pozostaje nadal na aktywnej "Stronie głównej", jednak jeśli zjedziemy właśnie około 70px w dół, widać, że menu przeskakuje. Moje pytanie jest zatem takie, czy można w jakiś sposób "oszukać" przeglądarkę, mówiąc jej, że jest 70px niżej od jej faktycznej pozycji, albo w jakiś inny sposób naprawić problematyczne menu?

Pozdrawiam i z góry dziękuję za pomoc smile.gif
SmokAnalog
Moim zdaniem lepiej by było, gdyby za aktualną zakładkę uznawana była ta, która zajmuje więcej niż połowę ekranu, a nie ta, która jest widoczna od dołu chociażby w jednym pikselu wysokości.

A co do Twojego problemu, to czysta arytmetyka - jak sam zauważyłeś, musisz brać pod uwagę, że przestrzeń robocza jest zajęta w pewnym stopniu przez menu na górze.
Slide
Dziękuję za wskazówkę, ale czy mógłbyś mi podpowiedzieć jak tego dokonać? Nie jestem na tyle biegły w jQuery smile.gif
by_ikar
W jquery aby pobrać pozycje danego elementu względem innych elementów, następnie pobrać wysokość okna przeglądarki, podzielić ją na pół. Może to na przykład wyglądać tak: http://jsfiddle.net/MU9ae/1/

Slide
Super!
Dziękuję bardzo za pomoc biggrin.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.