我正在尝试在我的引导模板上加载一个 mixitup 过滤器库。
问题是当我在第一个已经激活的选项卡窗格上加载图库时,它工作正常
但是当我试图在第二个或第三个选项卡窗格下加载它时它不起作用我认为引导 .active 类之间存在冲突?
这是选项卡窗格的主导航菜单
<div class="list-group">
<a href="#landing" role="tab" data-toggle="tab" class="list-group-item active">Home<i class="pull-xs-right fa fa-home"></i></a>
<a href="#about" role="tab" data-toggle="tab" class="list-group-item">About me <i class="pull-xs-right fa fa-star"></i></a>
<a href="#services" role="tab" data-toggle="tab" class="list-group-item">What I do <i class="pull-xs-right fa fa-suitcase"></i></a>
<a href="#portfolio" role="tab" data-toggle="tab" class="list-group-item">Portfolio <i class="pull-xs-right fa fa-photo"></i></a>
<a href="#blog" role="tab" data-toggle="tab" class="list-group-item">Blog <i class="pull-xs-right fa fa-comment"></i></a>
<a href="#contact" role="tab" data-toggle="tab" class="list-group-item">Contact <i class="pull-xs-right fa fa-phone"></i></a>
</div>
这是混音画廊
<div role="tabpanel" class="tab-pane fade" id="portfolio">
<nav class="navbar navbar-light bg-faded">
<div class="container">
<ul class="nav navbar-nav" id="filters">
<li class="nav-item"><a class="filter nav-link" data-filter=".plugins, .logo, .web">All</a>
</li>
<li class="nav-item"><a class="filter nav-link" data-filter=".plugins">App / Plugins</a>
</li>
<li class="nav-item"><a class="filter nav-link" data-filter=".logo">Logo Design</a>
</li>
<li class="nav-item"><a class="filter nav-link" data-filter=".web">Web Design</a>
</li>
<li class="nav-item">
<div class="fb-like" data-href="https://facebook.com/ydd.ninja" data-layout="button" data-action="like" data-show-faces="false" data-share="false"></div>
</li>
</ul>
</div>
</nav>
<div class="content">
<div id="portfoliolist">
<div class="portfolio logo" data-cat="logo">
<div class="portfolio-wrapper">
<img src="assets/images/bg.jpg" alt="" />
<div class="label">
<div class="label-text">
<a href="#" class="text-title">Bird Document</a>
<span class="text-category">Logo</span>
</div>
<div class="label-bg"></div>
</div>
</div>
</div>
<div class="portfolio web" data-cat="web">
<div class="portfolio-wrapper">
<img src="assets/images/dp2.jpg" alt="" />
<div class="label">
<div class="label-text">
<a href="#" class="text-title">Bird Document</a>
<span class="text-category">Web Design</span>
</div>
<div class="label-bg"></div>
</div>
</div>
</div>
<div class="portfolio plugins" data-cat="plugins">
<div class="portfolio-wrapper">
<img src="assets/images/1.jpg" alt="" />
<div class="label">
<div class="label-text">
<a href="#" class="text-title">Bird Document</a>
<span class="text-category">App Design</span>
</div>
<div class="label-bg"></div>
</div>
</div>
</div>
</div>
<!--//portfolio-list-->
</div>
</div>
上面的代码将不起作用,但如果我在第一次加载时将其设置为活动选项卡窗格,一切都很好,所有投资组合导航都不会有问题,并且可以点击并过滤图库
<div role="tabpanel" class="tab-pane fade in active" id="portfolio">
在此先感谢希望有人可以帮助我。