Всем доброго времени суток! Выкладываю пример рабочего кода по отслеживанию масштабирования на телефоне (возможно кому-то еще пригодится):
<div id="data"></div>
let viewport = window.visualViewport;
console.log(viewport);
let dataBlock = document.getElementById('data');
function resizeHandler() {
dataBlock.innerHTML += 'viewport.scale : ' + viewport.scale + "<br>";
dataBlock.innerHTML += 'viewport.width : ' + viewport.width + "<br>";
dataBlock.innerHTML += 'viewport.height : ' + viewport.height + "<br>";
dataBlock.innerHTML += 'viewport.offsetLeft : ' + viewport.offsetLeft + "<br>";
dataBlock.innerHTML += 'viewport.offsetTop : ' + viewport.offsetTop + "<br>";
dataBlock.innerHTML += 'viewport.onresize : ' + viewport.onresize + "<br>";
dataBlock.innerHTML += 'viewport.onscroll : ' + viewport.onscroll + "<br>";
dataBlock.innerHTML += 'viewport.pageLeft : ' + viewport.pageLeft + "<br>";
dataBlock.innerHTML += 'viewport.pageTop : ' + viewport.pageTop + "<br>";
dataBlock.innerHTML += "<hr>";
}
window.addEventListener('load', resizeHandler);
window.visualViewport.addEventListener('resize', resizeHandler);
На моем REDMI 9 работает. Отображается шаг масштабирования и еще некоторые полезные данные. У меня window.visualViewport.scale изменяется в диапазоне от 0.4 до 5. Очень удобно что после перезагрузки страницы текущий масштаб сохраняется, и свойство window.visualViewport.scale также остается правильным.
По этой ссылке нашел ответ на свой вопрос
https://stackoverflow.com/questions/...nch-level-zoom