Question

我有一组标签，每个标签都有一个转盘，标识为 #myCarousel，＃myCarousel1，＃myCarousel2 ...... 。如果我选择第一个选项卡，其中的滑块将起作用，其中选择第二个选项卡滑块也将起作用。然后再次选择第一个选项卡时，滑块将不起作用。

可以在链接中查看问题 http://www.seomanager.co/project-loyalty-kiosk。

有人可以提供解决方案。

Answer 1

我刚遇到同样的问题。

我的标签高度相同，因此如果标签的高度不同，则不确定需要做什么。

使用BS3 scss文件，在第225行的navs.scss中，标记将非活动标签设置为'display：none'，因此没有要填充的元素。

我如下覆盖BS。 'display：block'所以JS可以看到要填充的元素，然后将位置设置为'position：absolute'，这样它们就不会堆叠。

// Tabbable tabs (*default code)
// -------------------------

// Hide tabbable panes to start, show them when `.active`
.tab-content {
    > .tab-pane {
        display: none;
    }
    > .active {
        display: block;
    }
 }

// Tabbable tabs (*amended code)
// -------------------------

// Hide tabbable panes to start, show them when `.active`
.tab-content {
    > .tab-pane {
        // display: none;
        display: block;
        position:absolute;
    }
    > .active {
        display: block;
    }
 }

最后，为了让你的页面布局工作，你需要给.tab-content（我添加一个类.theme-tab-content）一个与你的轮播高度相匹配的固定高度。

Bootstrap轮播在选项卡内部不起作用

1 个答案: