[OpenLayers-Users] Streched Map if Sidebar.display=none

[Thomas Wagner]

Hi @all,

i'm trying to build a webpage using ol V3.4.

My side has two major Div-Tags:
  - map:  This is where the map is build in.
  - sidebar: Sidebar with some HTML content.
I created a sidebar switch (id=sidebarbtn).
On click this Button does "close" the sidebar by setting sidebar-display =
'none'
AND by setting map-style.left = '0px.
And there is the problem: After this operation my map is streched.

Here is the source:

--------------------------------------------
<script>
  function sideBarSwitch(){
      var mapdiv = document.getElementById('map');
      var sidediv = document.getElementById('sidebar');
      var btn = document.getElementById('sidebarbtn');

      if(sidediv.style.display != 'none'){
	sidediv.style.display = 'none';
	mapdiv.style.left = '0px';
	btn.innerHTML = '↓';
	
      } else {
	sidediv.style.display = 'block';
	mapdiv.style.left = '520px';
	btn.innerHTML = 'X';
      }
  }
</script>
<div id="sidebarbtn" onclick="sideBarSwitch();">X</div>
<div id="sidebar" style="position:absolute; top:0px; bottom:0px; left: 0px;
width:520px;"></div>
<div id="map" style="position:absolute; top:0px; bottom:0px; left:520px;
right:0px"></div>

--------------------------------------------

I certainly need to tell the "map" that it now has other dimensions.
Any Idea, how I can do that?

Cheers,
Tom