移動端適配方式

標籤：rem   建議   view   tag   cli   ext   idt   get   name   

1.動態改變viewport的值

引入：

<script type="text/javascript" src="ort.js"></script>
<script>

2.改變body的zoom值

<script>
function resetZoom(){
　　var deviceWidth=document.documentElement.clientWidth;//擷取裝置寬度
　　var scale=deviceWidth/640;//640是psd設計圖寬度
　　document.body.style.zoom=scale;
}
resetZoom();
window.onresize=function (){
　　resetZoom();
}
</script>

3.

rem適配

<script>
function resetFont(){
　　var HTML=document.getElementsByTagName(‘html‘)[0];
　　var deviceWidth=document.documentElement.clientWidth;

　　　　//擷取裝置寬度
　　var scale=deviceWidth/640;//640是psd設計圖寬度
　　HTML.style.fontSize=100*scale+‘px‘;
}
resetFont();
window.onresize=function (){
　　resetFont();
}
</script>

4.百分比

全換成百分比的方式

不建議使用，不太方便，最好用的還是rem適配；

 

移動端適配方式