Почему плагин mmenu работает некорректно?

Question

[Сергей Коноваленко]

Почему плагин mmenu работает некорректно на мобильных диапазонах, например, 375px, если в HTML не указать user-scalable=no, maximum-scale=1.0, minimum-scale=1.0 ?

То есть, при такой записи плагин работает нормально:

<meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

А при такой записи возникают баги на маленьких мобильных диапазонах:

<meta name="viewport"
          content="width=device-width, initial-scale=1.0">

Существует ли способ это исправить, чтобы плагин работал нормально без указания user-scalable=no, maximum-scale=1.0, minimum-scale=1.0 ?

Comments

[Владислав Лысков]

Что за баги, как и когда проявляются?

[Сергей Коноваленко]

Владислав Лысков, баг с меню начинается на всех диапазонах, которые ниже 550px, если не указать в HTML user-scalable=no, maximum-scale=1.0, minimum-scale=1.0

Баг можно воспроизвести как на мобильном телефоне, так на десктопном браузере включив в инструментах разработчика мобильный режим.

Он заключается в том, что когда ширина окна браузера становится все меньше и меньше чем 550px, то обертка .mm-menu_offcanvas, в которой находится меню, не изменяет свою ширину, она всегда равна 440px (как указано в свойстве max-width, которое задает плагин). Получается из-за этого перестает быть видимой правая часть меню.

Для класса .mm-menu_offcanvas плагин задает вот такие свойства:

.mm-menu_offcanvas {
    width: 80%;
    min-width: 240px;
    max-width: 440px;
}

Но у меня уже получилось решить этот баг. Вместо процентов, как указал плагин, задал единицу vw:

.mm-menu_offcanvas {
    width: 80vw;
}

После этого все стало отображаться нормально.

Меню с багом:


Меню без бага: