同位素不能达到指定的等级

时间:2014-08-06 15:13:23

标签: class filtering jquery-isotope pageload

我试图绕过同位素打开页面加载的所有项目。相反,我希望在加载页面时打开某个类别。我已将第一个按钮设置为class="button is-checked",但它仍在加载完整选择而不是与该按钮关联的数据过滤器。

您可以在此处查看示例:http://thesourcedirect.net/tour_sc2.php

代码如下:

 <div id="filters" class="button-group">
  <button style="border-bottom: solid 3px #000000;" class="button is-checked" data-filter="*">Full Tour</button>
  <button style="border-bottom: solid 3px #0a50ff;" class="button is-checked" data-filter=".rubber">Rubber</button>
  <button style="border-bottom: solid 3px hsl( 121, 100%, 36%);" class="button" data-filter=".plastic">Plastic</button>
  <button style="border-bottom: solid 3px hsl( 121, 0%, 52%);" class="button" data-filter=".metal">Metal</button>
  <button style="border-bottom: solid 3px hsl( 0, 100%, 52%);" class="button" data-filter=".electronic">Electronic</button>
  <button style="border-bottom: solid 3px hsl( 51, 100%, 52%);" class="button" data-filter=".dental">Dental</button>
  <button style="border-bottom: solid 3px hsl( 31, 100%, 52%);" class="button" data-filter=".lg">Lawn &amp; Garden</button>
  <button style="border-bottom: solid 3px hsl( 40, 100%, 34%);" class="button" data-filter=".text">Textiles</button>
</div>

<div class="isotope">
  <div class="morph element-item plastic" data-category="plastic">
        <a href="slideshow/img/1tour01.png" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/1tour01.jpg" name="Image6" width="100" height="100" id="Image6" />
  </div>
  <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/1tour02.png" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/1tour02.jpg" width="100" height="100" id="Image6" />
  </div>
  <div class="morph element-item metal" data-category="post-plastic">
        <a href="slideshow/img/100_0710.jpg" data-lightbox="metalTour" title="Metals Factory Tour"><img src="slideshow/tmb/100_0710.jpg" width="100" height="100" id="Image6" />
  </div>
  <div class="morph element-item plastic" data-category="post-plastic">
        <a href="slideshow/img/100_0712.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/100_0712.jpg" width="100" height="100" id="Image6" />
  </div>
  <div class="morph element-item plastic" data-category="plastic">
        <a href="slideshow/img/Acrylic line 1.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/Acrylic line 1.jpg" width="100" height="100" id="Image6" />
  </div>
  <div class="morph element-item electronic" data-category="metal">
        <a href="slideshow/img/DSC03424.jpg" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/DSC03424.jpg" width="100" height="100" id="Image6" />
  </div>
  <div class="morph element-item plastic" data-category="metal">
        <a href="slideshow/img/DSCI3646.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/DSCI3646.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/DSCI3648.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/DSCI3648.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/DSCI3649.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/DSCI3649.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/DSCI3650.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/DSCI3650.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/DSCI3651.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/DSCI3651.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/DSCI3652.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/DSCI3652.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item dental" data-category="electronic">
        <a href="slideshow/img/fatory (1).jpg" data-lightbox="dentalTour" title="Dental Factory Tour"><img src="slideshow/tmb/fatory (1).jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item dental" data-category="electronic">
        <a href="slideshow/img/fatory (2).jpg" data-lightbox="dentalTour" title="Dental Factory Tour"><img src="slideshow/tmb/fatory (2).jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/IMG_5322.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/IMG_5322.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item dental" data-category="electronic">
        <a href="slideshow/img/IMG_9037.JPG" data-lightbox="dentalTour" title="Dental Factory Tour"><img src="slideshow/tmb/IMG_9037.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item dental" data-category="electronic">
        <a href="slideshow/img/IMG_9044.JPG" data-lightbox="dentalTour" title="Dental Factory Tour"><img src="slideshow/tmb/IMG_9044.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item metal" data-category="electronic">
        <a href="slideshow/img/IMG_9163.jpg" data-lightbox="metalTour" title="Metals Factory Tour"><img src="slideshow/tmb/IMG_9163.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item metal" data-category="electronic">
        <a href="slideshow/img/IMG_9181.jpg" data-lightbox="metalTour" title="Metals Factory Tour"><img src="slideshow/tmb/IMG_9181.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/IMG_20140210_152152.jpg" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/IMG_20140210_152152.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/Picture2.jpg" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/Picture2.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/Picture3.jpg" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/Picture3.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/Picture4.jpg" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/Picture4.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/Picture5.jpg" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/Picture5.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/Picture6.jpg" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/Picture6.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/Picture7.jpg" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/Picture7.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/Picture8.jpg" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/Picture8.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/Picture9.jpg" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/Picture9.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/Picture10.jpg" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/Picture10.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/Picture11.jpg" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/Picture11.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/Picture12.jpg" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/Picture12.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/Picture13.jpg" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/Picture13.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/Picture14.jpg" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/Picture14.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/Picture15.jpg" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/Picture15.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/Picture16.jpg" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/Picture16.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/rbtour01.png" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/rbtour01.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/rbtour02.png" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/rbtour02.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/rbtour03.png" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/rbtour03.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/rbtour04.png" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/rbtour04.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/rbtour05.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/rbtour05.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/rbtour06.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/rbtour06.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/rbtour07.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/rbtour07.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/rbtour08.png" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/rbtour08.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/rbtour09.png" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/rbtour09.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/rbtour10.png" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/rbtour10.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/rbtour11.png" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/rbtour11.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/rbtour12.png" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/rbtour12.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/rbtour13.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/rbtour13.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/rbtour14.png" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/rbtour14.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/rbtour15.png" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/rbtour15.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/rbtour16.png" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/rbtour16.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/rbtour17.png" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/rbtour17.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item electronic" data-category="electronic">
        <a href="slideshow/img/rbtour18.png" data-lightbox="electronicTour" title="Electronics Factory Tour"><img src="slideshow/tmb/rbtour18.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/rbtour19.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/rbtour19.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/SAM_1257.JPG" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/SAM_1257.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/SAM_1258.JPG" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/SAM_1258.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/SAM_1505 (2).JPG" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/SAM_1505 (2).jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/SAM_3484 (2).JPG" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/SAM_3484 (2).jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/SAM_3523 (2).JPG" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/SAM_3523 (2).jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/SAM_3525 (2).JPG" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/SAM_3525 (2).jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item metal" data-category="electronic">
        <a href="slideshow/img/Torture Test on screen 01.jpg" data-lightbox="metalTour" title="Metals Factory Tour"><img src="slideshow/tmb/Torture Test on screen 01.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/tour03.png" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/tour03.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/tour04.png" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/tour04.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item metal" data-category="electronic">
        <a href="slideshow/img/tour05.png" data-lightbox="metalTour" title="Metals Factory Tour"><img src="slideshow/tmb/tour05.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item metal" data-category="electronic">
        <a href="slideshow/img/tour06.png" data-lightbox="metalTour" title="Metals Factory Tour"><img src="slideshow/tmb/tour06.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item metal" data-category="electronic">
        <a href="slideshow/img/tour07.png" data-lightbox="metalTour" title="Metals Factory Tour"><img src="slideshow/tmb/tour07.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item metal" data-category="electronic">
        <a href="slideshow/img/tour08.png" data-lightbox="metalTour" title="Metals Factory Tour"><img src="slideshow/tmb/tour08.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/tour09.png" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/tour09.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item metal" data-category="electronic">
        <a href="slideshow/img/tour10.png" data-lightbox="metalTour" title="Metals Factory Tour"><img src="slideshow/tmb/tour10.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item plastic" data-category="electronic">
        <a href="slideshow/img/tour11.png" data-lightbox="plasticTour" title=" Plastics Factory Tour"><img src="slideshow/tmb/tour11.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/tour12.png" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/tour12.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/tour13.png" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/tour13.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/tour14.png" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/tour14.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item rubber" data-category="electronic">
        <a href="slideshow/img/tour15.png" data-lightbox="rubberTour" title="Rubber Factory Tour"><img src="slideshow/tmb/tour15.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/tour16.png" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/tour16.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/tour17.png" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/tour17.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/tour18.png" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/tour18.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/tour19.png" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/tour19.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/tour20.png" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/tour20.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item lg" data-category="electronic">
        <a href="slideshow/img/tour21.png" data-lightbox="lgTour" title="Lawn &amp; Garden Factory Tour"><img src="slideshow/tmb/tour21.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/tour22.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/tour22.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/tour23.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/tour23.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/tour24.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/tour24.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/tour25.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/tour25.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/tour26.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/tour26.jpg" width="100" height="100" id="Image6" />
  </div>
   <div class="morph element-item text" data-category="electronic">
        <a href="slideshow/img/tour27.png" data-lightbox="textTour" title="Textiles Factory Tour"><img src="slideshow/tmb/tour27.jpg" width="100" height="100" id="Image6" />
  </div>
</div>
    <script src="slideshow/js/jquery.isotope.min.js"></script>
      <script>

    $( function() {
  // init Isotope
  var $container = $('.isotope').isotope({
    itemSelector: '.element-item',
    layoutMode: 'fitRows'
  });
  // filter functions
  var filterFns = {
    // show if number is greater than 50
    numberGreaterThan50: function() {
      var number = $(this).find('.number').text();
      return parseInt( number, 10 ) > 50;
    },
    // show if name ends with -ium
    ium: function() {
      var name = $(this).find('.name').text();
      return name.match( /ium$/ );
    }
  };
  // bind filter button click
  $('#filters').on( 'click', 'button', function() {
    var filterValue = $( this ).attr('data-filter');
    // use filterFn if matches value
    filterValue = filterFns[ filterValue ] || filterValue;
    $container.isotope({ filter: filterValue });
  });
  // change is-checked class on buttons
  $('.button-group').each( function( i, buttonGroup ) {
    var $buttonGroup = $( buttonGroup );
    $buttonGroup.on( 'click', 'button', function() {
      $buttonGroup.find('.is-checked').removeClass('is-checked');
      $( this ).addClass('is-checked');
    });
  });

});
    //@ sourceURL=pen.js

      </script>

任何和所有帮助将不胜感激。

此致 雅各布

1 个答案:

答案 0 :(得分:0)

找到解决方案。这是链接:https://stackoverflow.com/a/12009734/2478814输入$container.isotope({filter: '.home'});

解决