Почему плагин mmenu работает некорректно?
Почему плагин 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 ?
Баг с меню начинается на всех диапазонах, которые ниже 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;
}
После этого все стало отображаться нормально.
Ответы (2 шт):
Я использовал этот плагин неоднократно и ни когда не писал user-scalable вообще, если мне память не изменяет.
Также только что попробовал и не увидел ничего неожиданного.
Предполагаю, что проблема в чём то другом. Что есть не корректно, уточните, Сергей ?
Получилось решить проблему. Вместо процентов, как указал плагин, задал единицу vw:
.mm-menu_offcanvas {
width: 80vw;
}
После этого все стало отображаться нормально.