2012-05-12 2 views
5

ich arbeite jquery Isotop und die Filter funktionieren gut, das Verfahren unten auf der gleichen Seite portfolio.html gegeben mit:Isotopenfilter Link von einer anderen Seite

<li class="current"><a href="#" data-filter="*">all</a></li> 
<li><a href="#" data-filter=".design">design</a></li> 
<li><a href="#" data-filter=".coding">coding</a></li> 
<li><a href="#" data-filter=".logo">logo</a></li> 

Was ich versuche zu erreichen, besteht darin, eine Verknüpfung zu einer bestimmten Kategorie herzustellen, damit meine Nutzer von anderen Seiten in die gefilterte Kategorie gelangen können.

Ich habe versucht, die folgende Verknüpfung Methode, aber es hat nicht funktioniert:

<a href="portfolio.html#filter=logo" data-filter=".logo">logo</a> 

jemand kann mir helfen? Gibt es eine Methode, die Kategorien vorzufiltern?

Antwort

5

Nachdem Sie das Isotop konfiguriert haben, müssen Sie die Querystring-Variable lesen und dann auf die entsprechende Filterschaltfläche klicken.

jsFiddle Beispiel: http://jsfiddle.net/Y6vWn/

var filterFromQuerystring = getParameterByName('filter'); 
$('a[data-filter=".' + filterFromQuerystring + '"]').click(); 
+0

Dann klar zu sein, dass Sie auf die Seite mehr wie folgt verlinken: 'logo' - mit einem Querystring, kein Hash wie in der Frage. – ArleyM

+0

es funktioniert nicht für eine href Sie erwähnt @ArleyM – Sam

0

Bill-

versuchte ich Ihre Methode und kann nicht scheinen, damit es funktioniert. Sind diese zwei Linien alles, was notwendig ist? Hier

ist das Menü HTML für den Link zu meinem Isotop gefilterten Seite:

<li><a href="entertainment.html">Entertainment</a> 
    <ul> 
     <li><a href="entertainment.html#party">Party bands, Show and Tribute bands</a></li> 
     <li><a href="entertainment.html#classical">Classical, Jazz, and Easy Listening</a></li> 
     <li><a href="entertainment.html#djs">DJs, Emcees, Variety, and Interactive</a></li> 
    </ul> 
</li> 

Hier ist der Code für meine Filter (IDs nicht verwendet wird hier):

<div id="filters"> 
<ul class="option-set" data-option-key="filter"> 
    <li><a id="f-all" href="#filter" class="selected" data-option-value="*">All</a></li> 
    <li><a id="f-party" href="#filter" data-option-value=".party">Party Bands</a></li> 
    <li><a id="f-classical" href="#filter" data-option-value=".classical">Classical, Jazz, and Easy Listening</a></li> 
    <li><a id="f-djs" href="#filter" data-option-value=".djs">DJs and Emcees</a></li> 
</ul> 

Und hier ist das Skript, das ich am Ende der gefilterten Seite:

<script type="text/javascript"> 
$(document).ready(function() { 
    var pathname = window.location; 
    alert(pathname.toString()); //testing purposes 
    if(pathname.toString().indexOf("party") != -1){ 
     alert('shit went through 9'); //testing purposes 

     var filterFromQuerystring = 'party'; // getParameterByName('filter'); 
     $('a[data-option-value=".' + filterFromQuerystring + '"]').click(); 
    } 
}); 

Ich beabsichtige, die Seite wählen einen anderen Filter basierend auf was kommt nach dem Hashtag in der URL. Gibt es einen klügeren Weg?

+0

Wenn Sie Ihren Code in eine [jsFiddle] (http://jsFiddle.net) setzen, werde ich es für Sie arbeiten. – Bill