Значение аргумента Viewport «ширина устройства»; для ключевой «ширина» не распознается. Содержание игнорируется

Я пытаюсь установить различные видовые экраны для разных устройств Android. для этого я использую этот кусок кода.

<head>

<meta name="viewport" content="width=device-width; initial-scale=0.91; maximum-scale=0.91; user-scalable=0;target-densityDpi=device-dpi" />

<script>

if (window.devicePixelRatio == 1)
{
   document.querySelector("meta[name=viewport]").setAttribute('content', 'width=device-width, initial-scale=0.51, maximum-scale=0.51, user-scalable=0,target-densityDpi=device-dpi');

} else if (window.devicePixelRatio == 2) {

   document.querySelector("meta[name=viewport]").setAttribute('content', 'width=device-width, initial-scale=0.51, maximum-scale=0.51, user-scalable=0');

} else if (window.devicePixelRatio == .78) {

   document.querySelector("meta[name=viewport]").setAttribute('content', 'width=device-width, initial-scale=0.51, maximum-scale=0.51, user-scalable=0, target-densityDpi=device-dpi');

} else if (window.devicePixelRatio == 1.5) {

   document.querySelector("meta[name=viewport]").setAttribute('content', 'width=device-width, initial-scale=0.51, maximum-scale=0.51, user-scalable=0, target-densityDpi=device-dpi');

}

</script>

</head>

Теперь проблема заключается в том, что он не устанавливает соответствующие значения содержимого. и в Logcat, дающем эту ошибку

body { background - repeat : no - repeat ; margin : 0 ; ,

Значение аргумента Viewport «ширина устройства»; для ключевой «ширина» не распознается. Содержимое игнорируется.

Аргумент аргумента Viewport ", начальная шкала" не распознается и игнорируется.

Значение аргумента Viewport "no;" для ключевого «пользовательского масштабируемого» не распознается. Содержимое игнорируется.

Ключ аргумента Viewport «device-dpi» не распознается и игнорируется.

Какие-либо предложения. Извините за плохое редактирование, я не могу его отредактировать.

РЕДАКТИРОВАТЬ:

При этом мой Viewport все еще не работает на устройствах Android. Я хочу, чтобы я использовал только один css, и tat css должен масштабировать изображения в соответствии с устройством.

Для этого я использовал Viewport с целевым уровнем яркости и дал первый и максимальный масштаб в первый раз, когда он работал, но теперь, когда я запускаю этот подход на android, он игнорирует Viewport.

На самом деле проблема в том, что когда я устанавливаю изображение в фоновом режиме в html и запускаю это приложение на любом устройстве Android, он дает изображение в настройке увеличения. Для этого я изменяю свой html-файл и файл app.java и отключаю настройку масштабирования, а также использую целевую плотность, но все методы не работают. Вот html-код:

HTML

Вот css-файл:

background-image: url('../images/abc_title.png');
width: 1280px;
height: 670px;

}

div {ширина: 1280px; высота: 670px; }

Главная {

position: relative; background : transparent;
width: 129px;
height: 76px;
background: transparent; width : 129px; height : 76px;
margin-top: 80px;
margin-left: 80px;
        border: thin;

}

abc_slide {

position: relative;
background: transparent;
margin-top: 80px;
margin-left: 80px; width : 129px;
height: 76px;
width: 129px;
    border: thin;

}

song_slide {

<script>
    var viewportContent = '';
    if (window.devicePixelRatio = 1) {
        viewportContent = 'width=device-width, initial-scale=0.51, maximum-scale=0.51, user-scalable=0, target-densityDpi=device-dpi';
    } else if (window.devicePixelRatio == 2) {
        viewportContent = 'width=device-width, initial-scale=0.51, maximum-scale=0.51, user-scalable=0';
    } else if (window.devicePixelRatio == .78) {
        viewportContent = 'width=device-width, initial-scale=0.51, maximum-scale=0.51, user-scalable=0, target-densityDpi=device-dpi';
    } else if (window.devicePixelRatio == 1.5) {
        viewportContent = 'width=device-width, initial-scale=0.51, maximum-scale=0.51, user-scalable=0, target-densityDpi=device-dpi';
    }
    $('head').append('<meta name="viewport" content="' + viewportContent + '">');
</script>

}

Это из-за зрения дроида или кордовера

javascript,html,ibm-mobilefirst,

5

Ответов: 3

7 принят

Я не уверен, что вы пытаетесь сделать вообще и в том, если это определенно, но вы можете удалить метатег из своего HTML и использовать что-то вроде:

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

 <meta name="viewport" content="width=device-width,initial-scale=1">
7 ов

Имейте в виду, что вам нужно отделить аргументы содержимого viewport на «,» (как в ответе выше), а не «;» (который будет рассматриваться как часть стоимости и может привести к неожиданному поведению)

3

Я решил это, удалив пробелы после запятой

A±
JavaScript, HTML, IBM-mobilefirst,
Похожие вопросы
Яндекс.Метрика