Делаю универсальное масштабирование страницы под свои нужды:
var newWidth = window.innerWidth; //Получаем ширину
var newHeight = window.innerHeight; //Получаем высоту
var Relation = newWidth/newHeight; //Получаем отношение
var newWidthScale; //Пригодится для скейла по ширине
var newHeightScale; //Пригодится для скейла по высоте
//Вообще достаточно и 1 переменной для скейла, тапками не кидайтесь плиз
alert (newHeight); //Узнаем сколько по высоте (пригодится для проверки вручную)
if (Relation < 2/3){ //Если экран достаточно высок, чтобы разместить нужный мне элемент, то масштабируем по ширине, оставляя полосы сверху и снизу
newWidthScale = ((newWidth - 320) * 0.002625) + 0.8; //Линейное преобразование (допустим наша ширина равна 400, тогда получаем: 80*коэф.масштабирования + базис получаем масштаб равный: 1.01, что является правильным числом)
document.querySelector("meta[name=viewport]").setAttribute(
'content',
'width=device-width, initial-scale=' + newWidthScale + ', user-scalable=0');
// Тут в мету запихнули нужное нам число и всё ОТЛИЧНО работает
} else { //Если экран не достаточно высок, то масштабируем по высоте, оставляя полосы по бокам, и тут начинаются проблемы:
newHeightScale = ((newHeight - 460) * 0,00101) + 0.8;
//Итак, вот на моем телефоне он выдал высоту 284, считаем: -0,17776 + 0.8 = 0,62224, но не тут-то было
alert (newHeightScale); //Выводим и... барабанная дробь... получаем аш 65.8, на другом устройстве вообще было 10096153846154.8
document.querySelector("meta[name=viewport]").setAttribute(
'content',
'width=device-width, initial-scale=' + newHeightScale + ', user-scalable=0');
}
Вот если посмотреть на эти числа: 10096153846154.8 и 65.8, заметим, что в конце 0.8, значит проблема, где-то в этом месте:
((newHeight - 460) * 0,00101)
Что это может быть? Переполнение переменной, еще какая-либо ересь?
