视口参数值"device-width;" 关键字"宽度"无法识别.内容被忽略了
Use*_*590 5 html javascript ibm-mobilefirst
我想为不同的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中给出此错误
视口参数值"device-width;" 关键字"宽度"无法识别.内容被忽略了
视口参数值"device-width;" 关键字"宽度"无法识别.内容被忽略了
视口参数键";初始缩放"未被识别和忽略.
视口参数值"no;" 用于关键的"用户可扩展"无法识别.内容被忽略了
视口参数键"device-dpi"无法识别和忽略.
有什么建议.抱歉编辑不好我无法编辑它.
编辑:
在那,我的视频仍然没有在Android设备上工作.我希望我应该只使用一个css和tat css应该根据设备缩放图像.
为此,我使用了具有target-dpidensity的Viewport,并在第一次使用初始和最大比例时它正在工作但是现在当我在android上运行这种方法时它会忽略Viewport.
实际上问题是,当我在html的背景中设置图像并在任何Android设备上运行此应用程序时,它会以缩放的方式呈现图像.为此,我改变我的皮肤html和app.java文件并禁用缩放情绪,并使用target-dpidensity但所有方法都不起作用这里是html代码:
这是css文件:
body {
background-repeat: no-repeat;
margin: 0;
}
div {宽度:1280px; 身高:670px; }
家{
background-image: url('../images/abc_title.png');
width: 1280px;
height: 670px;
}
abc_slide {
position: relative; background : transparent;
width: 129px;
height: 76px;
background: transparent; width : 129px; height : 76px;
margin-top: 80px;
margin-left: 80px;
border: thin;
}
song_slide {
position: relative;
background: transparent;
margin-top: 80px;
margin-left: 80px; width : 129px;
height: 76px;
width: 129px;
border: thin;
}
是因为droidgap或cordove视图
我不确定你一般都会尝试做什么,特别是if,但你可以从你的HTML中删除元标记并使用类似的东西:
<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>
我已经通过在逗号后删除空格解决了它
<meta name="viewport" content="width=device-width, initial-scale=1 ">
<meta name="viewport" content="width=device-width,initial-scale=1">