До ширины 480px уменьшать масштаб страницы

Есть задача. Все что до 480px должно уменьшаться в масштабе. Думаю это сделать через виевпорт. Вот моя шапка. Использую тоже этот скрипт 'Conditional meta viewport'. Не работает.

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" >
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<link rel="stylesheet" type="text/css" href="style.css">
<title>My Crane</title>
<script>
/*
     * Paste into the end <head>
     */
    (function(){
    var width = screen.width;
    var oldViewport = document.querySelector('meta[name="viewport"]');
    var viewport = document.createElement('meta');
    viewport.setAttribute('name', 'viewport');
    viewport.setAttribute('content', 'width=' + (width <= 480 ? '480' : 'device-width'));
    document.head.replaceChild(viewport, oldViewport);
})();
    </script>
</head>

Вот ссылка на страницу которую нужно сделать. Помогите решить эту проблему.


Ответы (1 шт):

Автор решения: maindenis

Все работает. Просто нужно было смотреть на реальных смартфонах)))

→ Ссылка