JS控制浏览器网页内容的百分比缩放

JavaScript012

JS控制浏览器网页内容的百分比缩放,第1张

你可以让顶部导航栏和其他部分分处不同的层,然后你只需要对其他部分所处的层进行缩放处理,导航栏不动,这样就实现你的目的了。比如:

<div class=head>这是顶部导航栏</div>

<div class=body>这是其他主体部分</div>

然后js代码就可以这样:

$("div.body").css({"transform":"scale(0.8)","transform-origin":"50% 0"})

有办法,只是IE6等比例缩放无效 因为这要使用max-width属性

2个问题

自动缩放 可以通过max-width和max-height来实现

垂直居中,给你一个思路,对于2个inline-block元素同时使用vertical-align:middle能够产生意想不到的效果,IE7可以通过zoom来模仿inline-block

自己动手去写一下吧,你就会明白

var screen = window.screen//获取分辨率

screen.width;//获取分辨率的宽度

screen.height;//获取分辨率的高度

//页面缩放比例设置方法

document.getElementsByTagName('body')[0].style.zoom=0.67//该方法将页面设置比例调整为67%