我已经设置了一个动画砌体库,其中包含使用this的过滤器以及弹出的fancybox。
我尝试设置的是一个脚本,它将删除内嵌数据-fancybox =" 图库"它们将它们组合在一起,并允许用户滚动整个图库。
当点击其中一个过滤器链接时,它会添加一个"同位素隐藏"对图像进行分类并隐藏它们,但它仍然属于data-fancybox =" gallery"启用弹出窗口时仍可以访问。如果在图像上找到特定的类,我想设置一个脚本来删除该值。
这是我尝试的脚本。
如何删除数据-fancybox =" 图库"如果" 同位素隐藏"" 同位素隐藏" class被添加到图片标签?
jq('.filterbutton').click(function () {
if (jq("isotope .item img").hasClass("isotope-hidden")) {
jq(".isotope .item .img").parent().attr("data-fancybox", "");
} else if (jq("sotope .itme .img").hasClass("isotope-item")) {
jq(".isotope .item .img").parent().attr("data-fancybox", "gallery");
}
});

#gallery-header-center-right{
display: inline-block;
width: 100%;
margin: 10px 0;
}
.gallery-header-center-right-links {
color: #333333;
float: left;
height: 35px;
padding-right: 20px;
padding-left: 20px;
margin-left: 20px;
font-size: 16px;
font-weight: 400;
-webkit-transition: background 0.5s;
-moz-transition: background 0.5s;
-o-transition: background 0.5s;
transition: background 0.5s;
}
.gallery-header-center-right-links:hover {
background-color: rgba(63,141,191,1);
color: rgba(255,255,255,1);
cursor: pointer;
}
.gallery-header-center-right-links-current {
color: #FFFFFF;
background-color: rgba(63,141,191,1);
}
.gallery-header-center-right-links-current:hover {
background-color: rgba(63,141,191,0.5);
}
.filterbutton{
margin: 5px;
float: left;
}
.item{
width: 320px;
float: left;
margin: 5px;
}
.item img{
width: 100%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="gallery">
<div id="gallery-header">
<div id="gallery-header-center">
<div id="gallery-header-center-right">
<div class="gallery-header-center-right-links filterbutton" id="filter-all">All</div>
<div class="gallery-header-center-right-links filterbutton" id="filter-kw17">KW17</div>
<div class="gallery-header-center-right-links filterbutton" id="filter-kw16">KW16</div>
</div>
</div>
</div>
<div id="gallery-content">
<div id="gallery-content-center">
<a class="item" href="http://develop.e-retailer.co.nz/user/files/a-jordan.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/a-jordan.jpg" class="all kw17"/>
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/a-KWF.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/a-KWF.jpg" class="all kw16">
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/a-KWF2.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/a-KWF2.jpg" class="all kw17"/>
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/a-KWF3.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/a-KWF3.jpg" class="all kw17"/>
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/a-remix-mag.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/a-remix-mag.jpg" class="all kw16">
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/a-sammy.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/a-sammy.jpg" class="all kw17"/>
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/BeautyEQLoveridge.png" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/BeautyEQLoveridge.png" class="all kw17"/>
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/kwwomensweekly.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/kwwomensweekly.jpg" class="all kw16">
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/kylie.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/kylie.jpg" class="all kw17"/>
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/myraboot.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/myraboot.jpg" class="all kw17"/>
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/next.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/next.jpg" class="all kw16">
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/nextj.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/nextj.jpg" class="all kw17"/>
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/snuggle.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/snuggle.jpg" class="all kw16">
</a>
<a class="item" href="http://develop.e-retailer.co.nz/user/files/sundaymag.jpg" data-fancybox="gallery">
<img src="http://develop.e-retailer.co.nz/user/files/sundaymag.jpg" class="all kw17"/>
</a>
</div>
</div>
</div>
&#13;