小编典典

Bootstrap下拉列表受溢出:隐藏容器的限制,如何更改容器?

css

使用自举,我有一个下拉菜单( 小号 内)divoverflow:hidden,这是需要这样。这导致下拉菜单被容器裁剪。

我的问题是,如何解决这个裁剪问题,例如将项目内所有下拉菜单的容器更改为body,并尽可能降低成本?


阅读 381

收藏
2020-05-16

共1个答案

小编典典

如果有人对此有兴趣的解决方法,则引导程序下拉列表具有 _show.bs.dropdown_事件,您可以使用该事件将dropdown元素移出overflow:hidden容器。

$('.dropdown').on('show.bs.dropdown', function() {
  $('body').append($('.dropdown').css({
    position: 'absolute',
    left: $('.dropdown').offset().left,
    top: $('.dropdown').offset().top
  }).detach());
});

如果您希望在关闭下拉菜单后将元素移回其所属位置,则还会发生 hidden.bs.dropdown 事件:

$('.dropdown').on('hidden.bs.dropdown', function() {
  $('.bs-example').append($('.dropdown').css({
    position: false,
    left: false,
    top: false
  }).detach());
});
2020-05-16