«Анимация» в навигационной панели с Bootstrap 3

Question

Ниже мой код, и я пытаюсь воссоздать этот эффект: (http://hideo-html5-css3-bootstrap-website-template.little-neko.com/files/index.html) [Когда вы прокручиваете панель навигации, изменяется до половины размера и с некоторой прозрачностью или что-то в этом роде .] Любые идеи переделать его?

Код: http://pastebin.com/r0pS4AYD

Ps: Мой код не имеет ничего особенного, и я просто хочу, точка/направление, чтобы сделать это.

Answer 1

Когда пользователь переходит в определенную позицию,
или в вашем случае, когда он начинает прокручивать, вы можете добавить класс через jQuery.

Посмотрите здесь для получения дополнительной информации:

Leave menu bar fixed on top when scrolled

(код взят из поста в ссылке)

$(window).bind('scroll', function() { 
    if ($(window).scrollTop() > 50) { 
     $('.menu').addClass('fixed'); 
    } 
    else { 
     $('.menu').removeClass('fixed'); 
    } 
}); 

это лучше всего, когда вы создаете fiddle с вашим кодом, так что другие люди могут легко изменить ваш код и посмотреть, что там происходит.