关于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 相关文章推荐
Javascript中的var_dump函数实现代码
Sep 07 Javascript
jquery中this的使用说明
Sep 06 Javascript
jQuery 瀑布流 浮动布局(一)(延迟AJAX加载图片)
May 23 Javascript
基于BootStrap Metronic开发框架经验小结【四】Bootstrap图标的提取和利用
May 12 Javascript
浅谈Sublime Text 3运行JavaScript控制台
Jun 06 Javascript
jQuery Validate插件实现表单验证
Aug 19 Javascript
深入浅出 jQuery中的事件机制
Aug 23 Javascript
Angular 中 select指令用法详解
Sep 29 Javascript
浅谈Vue-cli 命令行工具分析
Nov 22 Javascript
浅谈React 服务器端渲染的使用
May 08 Javascript
vue 实现微信浮标效果
Sep 01 Javascript
layui lay-verify form表单自定义验证规则详解
Sep 18 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合并数组+与array_merge的区别分析
2010/08/01 PHP
PHP并发查询MySQL的实例代码
2017/08/09 PHP
thinkphp5框架实现的自定义扩展类操作示例
2019/05/16 PHP
js 变量类型转换常用函数与代码[比较全]
2009/12/01 Javascript
JS+css 图片自动缩放自适应大小
2013/08/08 Javascript
让IE8浏览器支持function.bind()方法
2014/10/16 Javascript
Bootstrap树形菜单插件TreeView.js使用方法详解
2016/11/01 Javascript
JavaScript比较两个数组的内容是否相同(推荐)
2017/05/02 Javascript
node.js学习之断言assert的使用示例
2017/09/28 Javascript
p5.js入门教程之小球动画示例代码
2018/03/15 Javascript
vue内置组件transition简单原理图文详解(小结)
2018/07/12 Javascript
vue获取data数据改变前后的值方法
2019/11/07 Javascript
Vue+abp微信扫码登录的实现代码示例
2020/01/06 Javascript
ES6 Generator基本使用方法示例
2020/06/06 Javascript
[45:25]OG vs EG 2019国际邀请赛淘汰赛 胜者组 BO3 第一场 8.22
2019/09/05 DOTA
python的exec、eval使用分析
2017/12/11 Python
python读取图片的方式,以及将图片以三维数组的形式输出方法
2019/07/03 Python
windows上彻底删除jupyter notebook的实现
2020/04/13 Python
windows10在visual studio2019下配置使用openCV4.3.0
2020/07/14 Python
举例详解HTML5中使用JSON格式提交表单
2015/06/16 HTML / CSS
泰国健康和美容服务预订网站:GoWabi
2019/06/03 全球购物
如何启动时不需输入用户名与密码
2014/05/09 面试题
空指针到底是什么
2012/08/07 面试题
南京某软件公司的.net面试题
2015/11/30 面试题
Tomcat的缺省是多少,怎么修改
2014/04/09 面试题
摄影实习自我鉴定
2013/09/20 职场文书
摄影助理岗位职责
2014/02/07 职场文书
一句话工作感言
2014/03/01 职场文书
大学军训感言1500字
2014/03/09 职场文书
红头文件任命书范本
2014/06/05 职场文书
大学生考试作弊检讨书
2014/09/21 职场文书
华清池导游词
2015/02/02 职场文书
入党介绍人意见2015
2015/06/01 职场文书
清明节随笔
2015/08/15 职场文书
2020年元旦晚会策划书模板
2019/12/30 职场文书
python process模块的使用简介
2021/05/14 Python