Косолапость с якорями с других страниц
Эх, я снова к вам за советом.
Вообщем есть страница. На ней есть якоря. Сверстана она криво ... (а может и не криво, во всяком случае мозгов сверстать у меня хватило только так.) В итоге мне пришлось задавать отступ якорю на 170px ниже В итоге получился у меня такой код. Смотрите ниже. Внимание вопрос: Как сделать так, чтобы при переходе на другую страницу якорь становился на тоже место? Попробовала так: Пример: test.ru/index.php#home Оно переходит но встаёт ровно на метке, а мне нужно на 170px ниже Понимаю, что нужно добывить в js переход на index.php но чёрт, у меня трабблы с синтаксисом. Помогите, плиииз :thanks: <ul class="nav navbar-nav main-nav"> <li><a href="#home" class="active">home</a></li> <li><a href="#product">product</a> </li> <li><a href="#partner">partner</a> </li> </ul> $(document).ready(function () { var menu_selector = ".main-nav"; function onScroll(){ var scroll_top = $(document).scrollTop(); $(menu_selector + " a").removeClass("active").each(function(){ var hash = $(this).attr("href"); var target = $(hash); var height = target.outerHeight(); if (target.position().top - 170 <= scroll_top && target.position().top - 170 + height > scroll_top) { $(this).addClass("active"); } }); } $(document).on("scroll", onScroll); $(menu_selector + " a").click(function(e){ e.preventDefault(); $(document).off("scroll"); $(menu_selector + " a.active").removeClass("active"); $(this).addClass("active"); var hash = $(this).attr("href"); var target = $(hash); $("html, body").animate({ scrollTop: target.offset().top-170 }, 500, function(){ history.replaceState(history.state, document.title, location.href.replace(/#.*$/g, '') + hash); $(document).on("scroll", onScroll); }); }); }); |
Цитата:
Может продуктивнее таки задавить ее в зародыше. Т.е. сделать нормальную верстку? |
ksa, эм, тут даже более не моя проблема, а bootstrap-a скорее. Исправлю одно, потяну за собой другое.
|
Darth_Pandora,
добавить в строку 33 var hash = window.location.hash; hash && $("a[href='"+hash+"']").click() |
рони,
Выдаёт эти ошибки: Missing use strict statement Expected an assignment or function call and instead saw an expression Missing semicolon |
Darth_Pandora,
у вас так? $(document).ready(function () { var menu_selector = ".main-nav"; function onScroll(){ var scroll_top = $(document).scrollTop(); $(menu_selector + " a").removeClass("active").each(function(){ var hash = $(this).attr("href"); var target = $(hash); var height = target.outerHeight(); if (target.position().top - 170 <= scroll_top && target.position().top - 170 + height > scroll_top) { $(this).addClass("active"); } }); } $(document).on("scroll", onScroll); $(menu_selector + " a").click(function(e){ e.preventDefault(); $(document).off("scroll"); $(menu_selector + " a.active").removeClass("active"); $(this).addClass("active"); var hash = $(this).attr("href"); var target = $(hash); $("html, body").animate({ scrollTop: target.offset().top-170 }, 500, function(){ history.replaceState(history.state, document.title, location.href.replace(/#.*$/g, '') + hash); $(document).on("scroll", onScroll); }); }); var hash = window.location.hash; hash && $("a[href='"+hash+"']").click(); }); |
Да, так.
Это главная страница, меню работает. http://burjuy.issohost.com/hTechInvest_bootstrap/ А с внутренней, например с этой не переходит http://burjuy.issohost.com/hTechInve...uct_custom.php Вот в этом файле js код: <script src="js/custom-menu-ex.js"></script> |
Darth_Pandora,
а нельзя jquery загрузить всего 1 раз(1.12.4), потом все jquery-plugin, потом весь код на основе jquery и только потом в самом конце bootstrap? |
рони, можно, но только как это мне поможет с меню? :-?
|
Часовой пояс GMT +3, время: 09:26. |