Поддержка Проблемы и решения Фиксированное меню при наведении курсора

  • В списке выпадающего меню Услуги много пунктов которые не вмещаются на экран, при прокрутке прокручивается сам сайт, но нужно что бы только меню прокручивалось при наведенном курсоре.

    Страница, с которой нужна помощь: [войдите, чтобы увидеть ссылку]

Просмотр 6 ответов — с 1 по 6 (всего 6)
  • Липкую шапку отключите

    Можно поподробнее?

    Добрый день,
    это решается на уровне свойств таблицы стилей (CSS). Упрощенно:

    
    .navbar {
        /* Разрешаем вертикальную прокрутку меню */
        overflow-y: auto;
        /* Указываем максимальную высоту меню, при превышении которой возникнет полоса прокрутки (в данном случае для примера 50vh, то есть половина от высоты экрана) */
        max-height: 50vh;
    }
    

    Это основа. Её придётся адаптировать и протестировать с учётом прочих стилей вашего сайта (для разных браузеров и разрешений экранов).

    Update: cказанное касается мобильной версии.

    • Ответ изменён 4 года, 2 месяца назад пользователем Norske.

    Задать максимальную высоту и overflow-y: auto; у выпадающих меню:
    http://images.vfl.ru/ii/1581844254/1b31e4db/29592707.png
    Высоту или тупо в пикселях, или как писали в зависимости от высоты экрана.

    Останется только стилизовать полосу прокрутки. Например, с помощью https://grsmto.github.io/simplebar/

    С мобильной версией все адаптируется нормально, проблема проявляется только на десктопах

    С мобильной версией все адаптируется нормально, проблема проявляется только на десктопах

    Там будет точно тот же принцип, только стили применять нужно к контейнеру всплывающего окна, в вашем случае это .dropdown-menu. Опять же, тестировать всё равно нужно везде и во всех состояниях, т.к. решение не кроссбраузерное.

Просмотр 6 ответов — с 1 по 6 (всего 6)
  • Тема «Фиксированное меню при наведении курсора» закрыта для новых ответов.