0
我想在我的索引页使用Mixitup投资组合。 在索引页面我有一个'nav nav-tabs'& Mixitup项目。 当我点击导航标签,混合项目隐藏。 如发生冲突。
我该如何解决它?冲突MixitUp与导航导航引导程序引导3
$(document).ready(function(){
var iast_MainGallery = document.querySelector('#iast-GalleryMainMix');
var mixer = mixitup(iast_MainGallery, {
animation: {
effects: 'fade scale stagger(50ms)' // Set a 'stagger' effect for the loading animation
},
load: {
filter: 'none' // Ensure all targets start from hidden (i.e. display: none;)
}
});
iast_MainGallery.classList.add('mixitup-ready');
mixer.show()
.then(function() {
// Remove the stagger effect for any subsequent operations
mixer.configure({
animation: {
effects: 'fade scale'
}
});
});
});
<div class="iast-GalleryBtnMixIt">
<button class="filter iast-GalleryBtnActive " data-filter="all">all</button>
<button class="filter" data-filter=".category-1">cat1</button>
<button class="filter" data-filter=".category-2">cat2</button>
<button class="filter" data-filter=".category-3">cat3</button>
<button class="filter" data-filter=".category-4">cat4</button>
<button class="filter" data-filter=".category-5">cat5</button>
</div>
<div id="iast-GalleryMainMix" class="container">
<!-- 1 -->
<div class="mix iast-MainGalleryMixItems category-1" data-myorder="1" style="display: inline-block;">
<div class="iast-GalleryItemUniName">
<a href="#">
item1
</a>
</div>
<a href="#">
<img class="img-responsive" src="assets/demo/img/gallery-thumb.jpg" width="150" height="150">
</a>
<div class="iast-GalleryItemDesc">
text
</div>
</div>
</div>