地图做底

使用地图页面做底position:fixed相对于浏览器固定.

<style>
#mapDIv{
    position:fixed;
    top:0px;
    left:0px;
    z-index: 0;
}
</style>

<iframe id="mapDiv" src="./administrativemap.html" frameborder="0" scrolling="no" width="100%" height="100%" style="height: 45%;border:none;z-index: 0"></iframe>

<script type="text/javascript">
//设置背景为浏览器高度
            autodivheight();
            function autodivheight(){ //函数：获取尺寸
                //获取浏览器窗口高度
                var winHeight=0;
                if (window.innerHeight)
                    winHeight = window.innerHeight;
                else if ((document.body) && (document.body.clientHeight))
                    winHeight = document.body.clientHeight;
                //通过深入Document内部对body进行检测，获取浏览器窗口高度
                if (document.documentElement && document.documentElement.clientHeight)
                    winHeight = document.documentElement.clientHeight;
                //DIV高度为浏览器窗口的高度
                document.getElementById("chartcontent").style.height= (winHeight - 114 - 80) +"px";
                document.getElementById("mapDIv").style.height= (winHeight) +"px";

            }
            window.οnresize=autodivheight; //浏览器窗口发生变化时同时变化DIV高度
        </script>

地图页面做背景_微信公众号

position的relative/absolute/fixed定位

当为元素设置position值为relative/absolute/fixed后，元素发生的偏移可能产生重叠，且z-index属性被激活。z-index值可以控制定位元素在垂直于显示屏方向（Z轴）上的堆叠顺序（stack order），值大的元素发生重叠时会在值小的元素上面。

当有些元素没有出现在地图地图上时,需要添加position样式属性。

如果这篇文章对你有用，可以关注本人微信公众号获取更多ヽ(^ω^)ﾉ ~

地图页面做背景_微信公众号_02