Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Проблема с синтаксисом (https://javascript.ru/forum/jquery/68997-problema-s-sintaksisom.html)

Darth_Pandora 23.05.2017 10:18

Проблема с синтаксисом
 
Нашла в интернете скрипт фиксированной навигации. Мне нужно, чтобы он не просто слайдился до якоря, а отбивал сверху 200px, то есть становился на позицию на 200px ниже. Я пока новичок в jquery, помогите подправить =)


Вот демка этого скрипта demo.webcareer.ru/2016/01/change_active_nav/

<header class="sticky-header">
	        <div class="top-menu">
	            <ul>
	                <li><a class="" href="#home">Главная</a></li>
	                <li><a href="#about" class="active">О нас</a></li>
	                <li><a href="#service" class="">Услуги</a></li>
	                <li><a href="#contact" class="">Контакты</a></li>
	            </ul>
	        </div>
	    </header>


var menu_selector = ".nav"; // Переменная должна содержать название класса или идентификатора, обертки нашего меню. 
 
function onScroll(){
    var scroll_top = $(document).scrollTop();
    $(menu_selector + " a").each(function(){
        var hash = $(this).attr("href");
        var target = $(hash);
        if (target.position().top-250 <= scroll_top && target.position().top + target.outerHeight() > scroll_top) {
            $(menu_selector + " a.active").removeClass("active");
            $(this).addClass("active");
        } else {
            $(this).removeClass("active");
        }
    });
}
 





$(document).ready(function () {
 
    $(document).on("scroll", onScroll);
 
    $("a[href^=#]").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-250
        }, 500, function(){
            window.location.hash = hash;
            $(document).on("scroll", onScroll);
        });
 
    });
 
});

j0hnik 23.05.2017 11:11

Вот в этой строчке не - 250 а +200
scrollTop: target.offset().top+200


А если вам надо чтоб сама менюшка ниже была в CSS укажите
.sticky-header {
      position: fixed;
      top: 200px; 
    }

Darth_Pandora 23.05.2017 11:31

Ой как глупо получилось) top-250 я сама указала, а оно у меня не сдвинулось и я подумала, что не туда вставила, так как не очень с js дружу, а оказалось это из-за кэша) Спасибо)


Часовой пояс GMT +3, время: 13:09.