示例代码:http://jsfiddle.net/vpg5g/我想有从按钮下拉菜单扩展超过模态的边界。如您所见,当前状态不可用。有什么办法可以做到这一点吗?
bq8i3lrv1#
模态不允许任何溢出,你可以通过使用来修复它:
.modal { overflow: visible; } .modal-body { overflow-y: visible; }
Working demo您可能希望添加一个类,以便仅将这些规则应用于真正需要它的模态,以防此修复程序产生错误。
new9mtju2#
如果无法删除溢出:你可以这样做
$('.drop-down-inside-modal').on('click' , '.dropdown-toggle', function(event){ var self = $(this); var selfHeight = $(this).parent().height(); var selfWidth = $(this).parent().width(); var selfOffset = $(self).offset(); var selfOffsetRigth = $(document).width() - selfOffset.left - selfWidth; var dropDown = self.parent().find('ul'); $(dropDown).css({position:'fixed', top: selfOffset.top + selfHeight , left: 'auto', right: selfOffsetRigth , width: '160px'}); }); function fixDropdownPosition(){ var openDropdownButton = $('.drop-down-inside-modal.open'); if($(openDropdownButton).length){ var selfHeight = $(openDropdownButton).height(); var selfWidth = $(openDropdownButton).width(); var openDropdownButtonOffset = $(openDropdownButton).offset(); var openDropdownButtonOffsetRigth = $(document).width() - openDropdownButtonOffset.left - selfWidth; var openDropdown = $(openDropdownButton).find('ul'); $(openDropdown).css({position:'fixed', top: openDropdownButtonOffset.top + selfHeight , left: 'auto' , right: openDropdownButtonOffsetRigth, width: '160px'}); }; }; $(".modal-body").unbind("scroll"); $(".modal-body").scroll(function(){ fixDropdownPosition(); }); $( window ).resize(function() { fixDropdownPosition(); });
2条答案
按热度按时间bq8i3lrv1#
模态不允许任何溢出,你可以通过使用来修复它:
Working demo
您可能希望添加一个类,以便仅将这些规则应用于真正需要它的模态,以防此修复程序产生错误。
new9mtju2#
如果无法删除溢出:你可以这样做