我有一个网站,我想要遵循浏览器窗口的大小调整,以便它始终适合。 我试着用当前窗口宽度除以全屏窗口宽度给出的比率来使用css transform scale属性。 它确实重新缩放,但一定会出现问题,因为它会在内容的左侧和右侧留下白色块(因此它会缩小网站太多,然后居中放置在窗口中) 以下是JavaScript代码:将网页调整为适合屏幕
$(window).resize(function(){
var ratio = $(window).width()/1340;
$('body').css('transform','scale('+(ratio)+')');
$('body').css('-ms-transform','scale('+(ratio)+')');
$('body').css('-moz-transform','scale('+(ratio)+')');
$('body').css('-webkit-transform','scale('+(ratio)+')');
});
有没有更好的方法来使页面适合窗口(或正确缩放比例)?
是...使用媒体查询。 –
你有没有考虑过使用全屏API? – Gaurav
使用媒体查询将意味着重新调整整个样式,并且全屏API仍然是实验性的。我只想知道我是否可以使用这个特殊技巧来给我一个正确的结果。 – user1507558