使用javascript设置页面的宽度自适应的方法如下:
首先新建一个test.aspx空白页面,如图所示:
将一个div拖动到新建的test.aspx空白页面中,其中div的源码为<div id="Div1" runat="server"></div>。如图所示:
将JavaScript函数进行定义,其中源码为<script type="text/javascript"></script>。函数名可以自定义为function resizeDiv(minusWidth, minusHeight) {}。在自定义的函数中包含了高度和宽度,如图所示:
其中函数的详细内容为,如图所示:
函数调用完成之后,开始调用函数,页面默认剩余的宽度是20px和40px。如图:
函数调用完成之后,利用JavaScript设置页面的宽度自适应即可成功。
应该是设置rem的函数加载顺序问题,应该先加载这个函数和css再去加载dom,这样就没有自适应跳动的问题,如果在加载dom之后调用该函数的话(在body之后加载函数),这样进入页面,fontSize会先以默认值显示,当读取了设置函数后才进行自适应。首先你得有个高宽比(比例),根据这个比,用js计算就是了。function resizeHeight(id,size){
var ele = document.getElementById(id)
var width = ele.offsetWidth
ele.style.height = size*width+"px"
}
说明:id是div的id(String),size是高宽比(Number)。
调用:
resizeHeight("youId",0.5)
window.onresize = resizeHeight("youId",0.5)