2013-03-08 89 views
1

我一直在試圖獲得同位素過濾工作..即時通訊新的jquery/javascript,但想獲得同位素工作在客戶端網站..我一直在堆棧和互聯網期待看到什麼即時通訊做錯了或失蹤..我也在wordpress主題使用這一點,並認爲可能是我的問題的一部分,但在按照每個教程和例子後,我可以發現我認爲它是我的一個小疏忽有希望jquery同位素和wordpress,過濾問題

,這裏是我的jsfiddle .. http://jsfiddle.net/CNj95/1/

繼承人過濾UL

<ul id="filters" class="option-set clearfix" data-option-key="filter"> 
    <li><a href="#" data-option-value=".category-instagram">instagram</a></li> 
    <li><a href="#" data-option-value=".category-tweets">tweets</a></li> 
    <li><a href="#" data-option-value=".category-facebook">facebook</a></li> 
    <li><a href="#" data-option-value=".category-youtube">youtube</a></li> 
</ul> 

下面是要被過濾

<div id="content"> 
    <div class="category-tweets boxy"><div class="soc-label" ></div> 
     <a href="" rel="prettyphoto" title="" ></a>      
     <p>CONTENT</p> 
    </div> 

    <div class="category-instagram boxy"><div class="soc-label" ></div> 
     <a href="" ><img width="150" height="150" src="" class="attachment-thumbnail wp-post-image" alt="" /></a>      
     <p>CONTENT</p> 
    </div> 
</div> 

Jquery的物品的實例爲是

jQuery(document).ready(function() { 
    var mycontainer = jQuery('#content'); 
    mycontainer.isotope({ 
     itemSelector: '.boxy' 
    }); 

    // filter items when filter link is clicked 
    jQuery('#options a').click(function (event) { 
     var selector = jQuery(this).attr('data-option-value'); 
     mycontainer.isotope({ 
      filter: selector 
     }); 
     return false; 
    }); 

});

+1

您知道WordPress隨附砌體嗎?這就像免費版的同位素。 – elclanrs 2013-03-08 02:00:14

+0

我不知道,我在找什麼,雖然主要是過濾..我有石工部分工作正常 – StephenPerrett 2013-03-08 02:35:53

回答

0

你選擇變量現在只是返回一個字符串...不是選擇器。易於修復。只需將其包裝在parens中並預先安裝一塊$:

jQuery('#options a').click(function (event) { 
    var selector = jQuery(this).attr('data-option-value'); 
    mycontainer.isotope({ 
     filter: $(selector) 
    }); 
    return false; 
    });