Android上的Bootstrap 3长模态滚动背景

概述我有一个很长的模态,没有完全显示在我的 Android移动设备上,按钮在屏幕下方,模态根本不滚动,但模态背后的灰色背景,是否有任何CSS / js锁定背景并允许模态在显示此模式时滚动的技巧？ 这应该是用Bootstrap 3修复的,但它对我不起作用.我能够通过组合-webkit-overflow-scrolling CSS属性和设置我的模态的最大高度来修复机智.由于我希望我的模态填满整个屏幕,我不 我有一个很长的模态,没有完全显示在我的 Android移动设备上,按钮在屏幕下方,模态根本不滚动,但模态背后的灰色背景,是否有任何CSS / Js锁定背景并允许模态在显示此模式时滚动的技巧？解决方法 这应该是用bootstrap 3修复的,但它对我不起作用.我能够通过组合-webkit-overflow-scrolling CSS属性和设置我的模态的最大高度来修复机智.由于我希望我的模态填满整个屏幕,我不得不连接一些JavaScript来检测移动设备并将我的.modal-content的最大高度设置为我的设备的视口高度

以下是我使用名为jRespond的库解决此问题的方法：

将此CSS添加到您的模态中

@media (max-wIDth: $screen-xs-max) {  .modal-dialog {    .modal-content {      -webkit-overflow-scrolling: touch;      overflow-y: auto;    }  }}

将jRespond添加到您的应用程序

https://github.com/ten1seven/jRespond/edit/master/js/jRespond.js

将以下代码添加到main.Js脚本中

/* This code handles the responsive modal for mobile */    var jRes = jRespond([{      label: 'handheld',enter: 0,exit: 767    }]);    jRes.addFunc({      breakpoint: 'handheld',enter: function() {        $('.modal-content').CSS('max-height',$(window).height());        $(window).on('orIEntationchange',function () {          $('.modal-content').CSS('max-height',$(window).height());        });      },exit: function () {        $('.modal-content').CSS('max-height',"");        $(window).off('orIEntationchange');      }    });

总结

以上是内存溢出为你收集整理的Android上的Bootstrap 3长模态滚动背景全部内容，希望文章能够帮你解决Android上的Bootstrap 3长模态滚动背景所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。