地图高度自适应

最新推荐文章于 2021-06-03 10:49:31 发布

weixin_30248399

最新推荐文章于 2021-06-03 10:49:31 发布

阅读量339

点赞数

原文链接：http://www.cnblogs.com/boonya/archive/2013/05/23/3094518.html

版权

<style type="text/css">
/*css控制地图大小自动充满整个窗口*/
html{height:100%}
body{height:100%;margin:0px;padding:0px}
#map_canvas{width:100%;height:100%}
@media print {#map_canvas {height: 950px;}}
</style>

在窗口中若有查询栏目，需要显示隐藏的时候，写一个方法动态设置地图div的高度，放在body的onresize事件里执行
//自动改变地图的高度
 function changeMapHeight() { 
     var qheight=$("#querytxt").height();
    if(qheight==1) { 
      qheight=80; 
    }else { 
      qheight=1; 
    } 
    var totalheight=$(window).height();
    var nowHeight=totalheight-qheight-20; // 
    alert("查询:"+qheight+"body:"+$(document.body).height()+"浏览器文档："
            +$(document).height()+"浏览器:"+$(window).height()+"地图:"
            +nowHeight+"可见区域:"+document.body.clientHeight);
    $("#map_canvas").height(nowHeight);
 }
 window.οnresize=changeMapHeight;

转载于:https://www.cnblogs.com/boonya/archive/2013/05/23/3094518.html