引入模式弹出窗口会导致手机和平板电脑上的触控区域无法响应

时间:2014-07-03 07:19:13

标签: php jquery css twitter-bootstrap

我有一个单页网站 - 基于twitter-bootstrap设置 - 几乎完成。 我刚刚大量修改了一个主题森林主题,所以我不能相信页面是如何工作的。 我发现了这样一个问题:当在移动设备或平板电脑上查看时,网站几乎无法通过触摸设备使用(滚动或点击)页面的前2/3。 您可以在此处http://goudkamp.stacklaw.com.au进行测试。

如果我删除或注释掉最近为隐私免责声明和人们的电子邮件按钮引入的模式,则页面滚动和触摸按预期工作。 (请忽略我尚未修复CSS的非移动设备部分,以便做出响应) 没有模态的同一页面的示例是http://goudkamp.stacklaw.com.au/index2.php,您可以看到触控控制正常。

现在,这就是我的问题...因为该网站基于预构建的主题,而且在jquery方面我不是最有能力的调试器,我不知道如何解决这个问题。 我非常喜欢模态的想法,所以我喜欢一些关于如何纠正问题的指导,而不是找到另一种显示弹出窗口的方法。

提前致谢。 -Reece

1 个答案:

答案 0 :(得分:0)

事实证明它不是一个jquery bug ...而是一个CSS问题。

解决方案是将display:none;添加到.modal {} bootstrap-responsive.css或.modal {display:none!important;}添加到styles.css。

我希望这可以帮助遇到同样问题的其他人。