我使用的是Bootstrap 2.0.3,里面有可折叠/可展开的div的下拉菜单.当下拉菜单溢出div时,它们被切断(但不应该). Jsfiddle来说明:
http://jsfiddle.net/t3wFK/1/
在Bootstrap 2.0.2中,菜单不会被中断:http://jsfiddle.net/u3wkK/
通过使用css规则,我发现了一半的解决方法如下:
#stuff.in { overflow: visible; }
每当标有’collapse’的div被扩展时,’in’css类都会被bootstrap添加.
不幸的是,这种解决方法在Firefox中完全崩溃.
有任何想法吗?我正在考虑降级到Bootstrap 2.0.2,但这将是痛苦的.
解决方法
这里的问题似乎是在2.0.3中,Bootstrap将.collapse类应用于#stuff元素.在bootstrap css中,有一种风格:
.collapse { overflow: hidden; }
但是,当扩展一个.collapse目标时,overflow属性保持隐藏.
不知道它是否是一个错误(将不得不深入研究,看看是否有任何缺点这样做),但修改.collapse.in的规则将工作.
.collapse.in { height: auto; /* this style already exists in bootstrap.css */ overflow: visible; /* this one doesn't. Add it! */ }
如果您不想修改Bootstrap的CSS(可能会出现意见中提到的无意义的副作用),则可以将显示和隐藏事件处理程序添加到#stuff元素以修改overflow属性:
$('#stuff').on({ shown: function(){ $(this).css('overflow','visible'); },hide: function(){ $(this).css('overflow','hidden'); } });
原文地址:https://www.jb51.cc/jquery/179865.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。