1

Всем привет! Уже второй день пытаюсь решить проблему с меню. Может кто-нибудь подскажет, как сделать так, чтобы оно растягивалось во всю высоту страницы, а не окна? Пробовала запретить скролл, но тогда на мобильных все пункты меню не влазят, и все это становится нечитабельным(

https://jsfiddle.net/spacyfox/2pqn3h6p/3/

function resizeNav() {
        // Set the nav height to fill the window
        $("#nav-fullscreen").css({"height": window.innerHeight});

        // Set the circle radius to the length of the window diagonal,
        // this way we're only making the circle as big as it needs to be.
        var radius = Math.sqrt(Math.pow(window.innerHeight, 2) + Math.pow(window.innerWidth, 2));
        var diameter = radius * 2;
        $("#nav-overlay").width(diameter);
        $("#nav-overlay").height(diameter);
        $("#nav-overlay").css({"margin-top": -radius, "margin-right": -radius, "margin-bottom": -radius});
    }

    // Set up click and window resize callbacks, then init the nav.
    $(document).ready(function() {
        $("#nav-toggle").click(function() {
            $("#nav-toggle, #nav-overlay, #nav-fullscreen").toggleClass("open");;
        });

        $(window).resize(resizeNav);

        resizeNav();
    });

1 ответ 1

1

Вот так?

var body = document.body,
html = document.documentElement;
    var height = Math.max( body.scrollHeight, body.offsetHeight, 
                   html.clientHeight, html.scrollHeight, html.offsetHeight );

$("#nav-fullscreen").css({"height": height});
...

https://jsfiddle.net/2pqn3h6p/4/

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.