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

Question

[SMK DN]

Необходимо сделать фиксированое меню как на сайте getfinal.com
Важно чтобы при прокрутке прилипало к верху страницу и менялся цвет как на примере.
Может есть где-то гайд или может кто-то рассказать - как реализовать.
Заранее спасибо

Answer 1

[Максим Тимофеев]

Необходимо сделать фиксированое меню

position:fixed;

Может есть где-то гайд

"учебник по css" называется

менялся цвет как на примере

тут "учебник по jquery". Ловим событие скрола, проверяем offset если больше 0 - меняем класс. В css на данный клас вешаем что угодно в том числе и смену фона.
Вот например:
https://jsfiddle.net/rzqcwzrh/9/

Answer 2

[Павел]

jsfiddle.net/adamb/F4BmP
codepen.io/senff/pen/ayGvD

$(window).scroll(function () {

        var ControlDivTop = $('#cs_controlDivFix');

        $(window).scroll(function () {
            if ($(this).scrollTop() > 50) {
               ControlDivTop.stop().animate({ 'top': ($(this).scrollTop() - 62) + "px" }, 600);
            } else {
              ControlDivTop.stop().animate({ 'top': ($(this).scrollTop()) + "px" },600);
            }
        });
    });

Answer 3

[Дмитрий]

Добрый день.
Для блока, в котором содержится меню сss стиль position:fixed
Чтобы сменить цвет, отслеживайте при помощи jquery смещение страницы. Изменилось на заданную величину - меняйте background у блока с меню.
Как-то так.
А вообще-то, откройте исходный код сайта и посмотрите, как сделано именно у них.

Answer 4

[Ксения]

фон менять можно не обязательно JS. Можете отслеживать псевдоэлементом :hover например так