html – 将网站扩展到移动设备

我有一个网络应用程序,其中响应式布局不是移动设备的选项,所以我尝试使用视口缩放一点,但没有成功这样做.

页面大小为1280×720所以在小屏幕上它应该缩小,在较大的屏幕上放大：

var scale = $(window).width() / 1280;

$('head').append('<meta name="viewport" content="width=device-width,height=device-height,initial-scale=' + scale + ',maximum-scale=' + scale + ',user-scalable=0">');

我只尝试过这个宽度,但结果不是理想的,我做错了吗？

解决方法

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

以及JS

var siteWidth = 1280;
var scale = screen.width /siteWidth

document.querySelector('meta[name="viewport"]').setAttribute('content','width='+siteWidth+',initial-scale='+scale+'');

您应该能够在移动设备上显示初始放大或缩小的页面.你必须检查设备是否在纵向.对于横向,您需要使用screen.height而不是screen.width

（编辑：衡阳站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!