happy_patron

Помогите сделать изменение меню при скроллинге?

1 сообщение в этой теме

Вот код шапки. html+css

http://jsbin.com/wusekufina/edit?html,css,output

 

чтоб правильно увидеть окно браузера, растяните часть jsbinA аутпут до 790+ пикселей.

 

Как через js сделать при прокрутке страницы (на 50-100-200... пикс.) изменения шапки? Нужно чтоб меню стало в один ряд с логотипом, и уменьшился шрифт в самих пунктов меню. А при скроллинге обратно шапка стала на место.

 

Пробывал такие варианты:

$(window).scroll(function(){
        var scrolled = $(this).scrollTop();
        if( scrolled >= 107 ) {
            $('.main-navigation a').addClass('КЛАСС с изменениями');
        }   
        if( scrolled <= 107 ) {     
            $('.main-navigation a').removeClass('КЛАСС с изменениями');
        }
    });

не выходит ничего не меняет.

window.onscroll = function(){
	 var html = document.documentElement, body = document.body;
	 var BlkStyle = document.getElementById('block').style; /*--тут искал и бай КлассНаме, и икспас...---*/
	 if(html.scrollTop>49||body.scrollTop>49) { //alert()
	     BlkStyle.borderColor="blue";
	     BlkStyle.height="34px";
	 } else BlkStyle.height=BlkStyle.borderColor="";
}

И тут не могу понять.

 

Прошу помощи.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!


Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.


Войти сейчас

  • Сейчас на странице   0 пользователей

    Нет пользователей, просматривающих эту страницу