Как сделать такое фиксированное меню?

[shabdanff]

Здравствуйте! Нужно создать появляющееся меню как здесь http://mobilak-spb.ru/

При прокрутке сайта вниз наверху появляется фиксированное меню. Как такое сделать???

А еще туда надо добавить эти категории

[legioner26]

Ну к примеру так.

Стили и верстку думаю сами скопируете

<script type="text/javascript">
function menu_top(){
	    var scroll_menu = $(document).scrollTop();
	    if(scroll_menu > 400) --->>> Свое значение
		    $("#fixed-menu").removeClass("hidden");
	    else
	        $("#fixed-menu").addClass("hidden");
	}
	$(document).scroll(function(){
	    menu_top();
	})
</script>

 

[spectre]

48 минут назад, legioner26 сказал:

Ну к примеру так.

Стили и верстку думаю сами скопируете

 

 

мне кажется более оптимальное решение такого плана

 

var menu = $(".menuclass");
             
$(window).scroll(function(){
            if ( $(this).scrollTop() > 100 && menu.hasClass("default") ){
			menu.removeClass("default").addClass("fixed");
            } else if($(this).scrollTop() <= 100 && menu.hasClass("fixed")) {
			menu.removeClass("fixed").addClass("default");
        }
});  	

это позволит использовать одно меню, просто классами его разруливать, ну во всяком случае я так делаю

 

возможно ваше решение работает быстрее, но мне кажется что дергать функцию каждый раз при скролле более накладно чем проверять позицию элемента при скролле

 

UPDATE

 

на примере используется плагин

https://www.smartmenus.org/

Edited March 17, 2018 by spectre

[legioner26]

Ваше решение тоже хорошее. Но я за то, чтобы за каждую процедуру отвечала своя функция.

[legioner26]

Когда гора кода так легче понять что и где.

[legioner26]

Может я и не прав хз

[legioner26]

Да и к премеру если чуть подправить ее, то можно передвать в нее хоть 100 меню

[HyperLabTeam]

@spectre верстать могишь?)

[legioner26]

На то она и функция

[legioner26]

Спора нет. Для одноразового использования ваше решение актуальнее моего.

[spectre]

32 минуты назад, AWARO сказал:

@spectre верстать могишь?)

Не, верстка тупая тема, сам ищу верстальщика) 

[HyperLabTeam]

Только что, spectre сказал:

Не, верстка тупая тема, сам ищу верстальщика) 

я тоже ищу тупицу )

[HyperLabTeam]

3 часа назад, shabdanff сказал:

Здравствуйте! Нужно создать появляющееся меню как здесь http://mobilak-spb.ru/

При прокрутке сайта вниз наверху появляется фиксированное меню. Как такое сделать???

А еще туда надо добавить эти категории

ссылку бы хоть оставили, какие эти категории? сторонние ссылки есть там?)

[alena967]

возможно я туплю, но зачем js?

<nav id="menu" class="navbar affix-top"  data-spy="affix" data-offset-top="циферка в пикселях с которой начинается фиксация">