title: introducing modal pop-up causes unresponsive touch area on mobiles and tablets
body: <p>I have a one-page website - based on a twitter-bootstrap setup - that is almost complete.
  I've just heavily modified a themeforest theme, so I can't take credit for how the page works.
  I've discovered an issue where the website, when viewed on a mobile or tablet, has almost the top 2/3 of the page unable to be used (scrolled or clicked on) by a touch device.
  You can test it here <a href="http://goudkamp.stacklaw.com.au" rel="nofollow">http://goudkamp.stacklaw.com.au</a>.</p>
  
  <p>If I remove or comment out the modals that have recently been introduced for the privacy disclaimer and the people's email buttons, the page scroll and touch works as expected.
  (please ignore the non-mobile friendly sections that I haven't yet fixed the CSS up to make responsive)
  An example of the same page without the modals is <a href="http://goudkamp.stacklaw.com.au/index2.php" rel="nofollow">http://goudkamp.stacklaw.com.au/index2.php</a> where you can see that touch control is working fine.</p>
  
  <p>Now, here lies my problem... because the site is based on a prebuilt theme and I'm not the most competent debugger when it comes to jquery, I don't know how to fix this issue.
  I really like the idea of the modals, so I'd love some guidance on how to correct the problem rather than find an alternative way to show the pop-ups.</p>
  
  <p>Thanks in advance.
  -Reece</p>