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/

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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