title: 2 Scrollbars visible when I open a modal dialog
body: <p>We have a baffling issue whereby when we try to open a modal dialog box from a parent page it opens with 2 vertical scrollbars next to each other. One controls the modal box, the other one controls the main page behind it.</p>
  
  <p>To have 2 scrollbars is not ideal and have tried to implement a solution for this.
  We added some javascript in the dialog box page which would set the  style to overflow:hidden when the modal dialog is open.</p>
  
  <pre><code>&lt;script&gt;
  function myOnLoad() {
      window.parent.$('body').css('overflow', 'hidden');
  }
  </code></pre>
  
  <p></p>
  
  <p>and used....</p>
  
  <pre><code>&lt;body onload="myOnLoad()"&gt;
  </code></pre>
  
  <p>This works and effectively removes the scrollbar in the page behind it (i.e it does what it should) however we also want to set the overflow back to ‘auto’ when the modal dialog is closed…</p>
  
  <p>We have done this by adding this code..</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  // close Modal
  $("#close").click(function () {
  window.parent.$('body').css('overflow', 'auto');
  window.parent.$("iframe").attr('src', '');
  window.parent.$(".modalDialog").removeClass('show');
  });
  </code></pre>
  
  <p></p>
  
  <p>However this does not seem to work as the modal dialog closes but the scrollbar is still hidden on the main page.
  Can anyone tell me what I might be doing wrong here? I have tried different overflow properties but nothing seems to work</p>