Показать сообщение отдельно
  #2 (permalink)  
Старый 27.03.2018, 13:00
Аспирант
Отправить личное сообщение для emptyindorill Посмотреть профиль Найти все сообщения от emptyindorill
 
Регистрация: 16.02.2012
Сообщений: 73

Все просто:

<div class="wrap"/>
     <div id="block1" class="section"/>
     <div id="block2" class="section"/>
     <div id="block3" class="section"/>
     <div id="block4" class="section"/>


<nav>
<a href="#block1" class="link active">Главная</a>
<a href="#block2" class="link">Услуги</a>
<a href="#block4" class="link">Часто задаваемые вопросы</a>
</nav>


$(function(){
$(window).scroll(function(){
         var $sections = jQuery('.wrap .section');
	$sections.each(function(i,el){
        var top  = jQuery(el).offset().top-100;
        var bottom = top + jQuery(el).height();
        var scroll = jQuery(window).scrollTop();
        var id = jQuery(el).attr('id');
    	if( scroll > top && scroll < bottom){
            jQuery('a.active').removeClass('active');
			jQuery('a[href="#'+id+'"]').addClass('active');
        }
    })
 });

    $("nav").on("click","a.link", function (event) {
        event.preventDefault();
        var id  = $(this).attr('href'),
            top = $(id).offset().top;
        $('body,html').animate({scrollTop: top}, 800);
    });

	        $(window).scroll(function(){
	            if(jQuery(this).scrollTop()>217){
	                jQuery('.body_center .left').addClass('fixed');
	            }
	            else if (jQuery(this).scrollTop()<217){
	                jQuery('.body_center .left').removeClass('fixed');
	            }
	        });

});


Скрипт праллакс скролинга, скрипт меню с активом и прилипашка.
Ответить с цитированием