关于BootStrap modal 在IOS9中不能弹出的解决方法(IOS 9 bootstrap modal ios 9 noticework)


Posted in Javascript onDecember 14, 2016

最近的项目用的bootstrap前端,手机刚刚更新IOS9发现其中的modal有个bug,首页点弹出框会出现问题,找了好多资料终于找到解决办法。在CSS中加入以下代码

CSS

body { 
 padding-right: 0px !important 
} 
.modal-open { 
 overflow-y: auto; 
}

PS:bootstrap datepicker 在bootstrap modal中不显示问题

可以通过在 input 输入框之外 嵌套 <span style="position: relative; z-index: 9999;"> 完美解决问题。

修改前:

<div class="input-group">
  <input type="text" class="form-control date-picker" data-date-format="yyyy-mm-dd" name="contract_date" id="contract_date" value="{{ 'now'|date('Y-m-d') }}">
  <span class="input-group-addon"><i class="fa fa-calendar bigger-110"></i></span>
</div>

修改后:

<div class="input-group">
  <span style="position: relative; z-index: 9999;">
    <input type="text" class="form-control date-picker" data-date-format="yyyy-mm-dd" name="contract_date" id="contract_date" value="{{ 'now'|date('Y-m-d') }}">
  </span>
  <span class="input-group-addon"><i class="fa fa-calendar bigger-110"></i></span>
</div>

以上所述是小编给大家介绍的关于BootStrap modal 在IOS9中不能弹出的解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
使用ExtJS技术实现的拖动树结点
Aug 05 Javascript
js window.onload 加载多个函数和追加函数详解
Jan 08 Javascript
JavaScript使用yield模拟多线程的方法
Mar 19 Javascript
JQuery分屏指示器图片轮换效果实例
May 21 Javascript
jQuery Mobile中的button按钮组件基础使用教程
May 23 Javascript
Bootstrap零基础入门教程(二)
Jul 18 Javascript
js实现移动端微信页面禁止字体放大
Feb 16 Javascript
jQuery实现对网页节点的增删改查功能示例
Sep 18 jQuery
小程序tab页无法传递参数的方法
Aug 03 Javascript
Nuxt v-bind绑定img src不显示的解决
Dec 05 Javascript
JS实现音量控制拖动
Jan 15 Javascript
使用vue-cli3+typescript的项目模板创建工程的教程
Feb 28 Javascript
实例解析angularjs的filter过滤器
Dec 14 #Javascript
微信小程序 input输入框控件详解及实例(多种示例)
Dec 14 #Javascript
javascript中对象的定义、使用以及对象和原型链操作小结
Dec 14 #Javascript
JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)
Dec 14 #Javascript
javascript中的try catch异常捕获机制用法分析
Dec 14 #Javascript
微信小程序 scroll-view组件实现列表页实例代码
Dec 14 #Javascript
AngularJS指令中的绑定策略实例分析
Dec 14 #Javascript
You might like
php 无限级分类学习参考之对ecshop无限级分类的解析 带详细注释
2010/03/23 PHP
微盾PHP脚本加密专家php解密算法
2020/09/13 PHP
php简单的会话类代码
2011/08/08 PHP
PHP提示Notice: Undefined variable的解决办法
2012/11/24 PHP
基于php无限分类的深入理解
2013/06/02 PHP
PHP实现对文本数据库的常用操作方法实例演示
2014/07/04 PHP
ThinkPHP实现ajax仿官网搜索功能实例
2014/12/02 PHP
PHP实现微信网页授权开发教程
2016/01/19 PHP
PHP利用超级全局变量$_POST来接收表单数据的实例
2016/11/05 PHP
javascript 获取网页参数系统
2008/07/19 Javascript
利用JQuery为搜索栏增加tag提示
2009/06/22 Javascript
Jquery工作常用实例 使用AJAX使网页进行异步更新
2011/07/26 Javascript
JS判断网页广告是否被浏览器拦截过滤的代码
2015/04/05 Javascript
JS延时提示框实现方法详解
2015/11/26 Javascript
JavaScript中Function函数与Object对象的关系
2015/12/17 Javascript
浅谈JavaScript的全局变量与局部变量
2016/06/10 Javascript
ros::spin() 和 ros::spinOnce()函数的区别及详解
2016/10/01 Javascript
JS 实现Base64编码与解码实例详解
2016/11/07 Javascript
详解利用 Vue.js 实现前后端分离的RBAC角色权限管理
2017/09/15 Javascript
js获取文件里面的所有文件名(实例)
2017/10/17 Javascript
JS实现左边列表移到到右边列表功能
2018/03/28 Javascript
基于JS开发微信网页录音功能的实例代码
2019/04/30 Javascript
[01:53]2016完美“圣”典风云人物:Maybe专访
2016/12/05 DOTA
Python字符串格式化
2015/06/15 Python
Python Flask基础教程示例代码
2018/02/07 Python
python字符串与url编码的转换实例
2018/05/10 Python
对pandas中to_dict的用法详解
2018/06/05 Python
Python3如何使用tabulate打印数据
2020/09/25 Python
HTML5安全介绍之内容安全策略(CSP)简介
2012/07/10 HTML / CSS
高中生毕业自我鉴定范文
2013/12/22 职场文书
优秀本科生求职推荐信
2014/02/24 职场文书
小学生安全教育主题班会
2015/08/12 职场文书
医学生自荐信范文(2016精选篇)
2016/01/28 职场文书
竞聘书的秘诀
2019/04/02 职场文书
python如何进行基准测试
2021/04/26 Python
Vue通过懒加载提升页面响应速度
2021/05/10 Vue.js