jQuery isotope: filter on page load based on get variable

Question

I am working with the jQuery isotope plugin and would like to display only items from a particular group when the page loads. Currently all of the items are displaying:

http://aproposstudio.com/category/work/

For example, on the link above, is there a way to load the page with the 'murals' displaying?

thanks.

score 6 · Answer 1 · edited Oct 01 '13 at 08:17

6

The answer is quite easy:

$('#container').isotope({ filter: '.your-filter-name' });

Use this line in your code.

Refere this link: http://isotope.metafizzy.co/docs/filtering.html

edited Oct 01 '13 at 08:17

Sandip Armal Patil

6,241
21
93
160

answered Oct 01 '13 at 07:56

madvertising

69
1
2

Perfect Solution – Maulik patel Oct 08 '21 at 11:23

score 1 · Answer 2 · answered Jan 05 '12 at 19:39

So i think you just want to use the simple hide() and show() methods

If you use the classes applied to your html elements, you can easily select them and hide them with the following jQuery lines.

$(".project").hide()
$(".murals").show()

now, what this will do is 'hide' all of the projects, and show only the murals.

Does that make sense?

score 0 · Answer 3 · edited Mar 23 '13 at 15:17

0

It's very simple!

(function ($) {
    $(window).load(function () {

        // settings
        var sortBy = 'date', // SORTING: date / name
            sortAscending = true, // SORTING ORDER: true = Ascending / false = Descending

            theFilter = '.YOUR SORT'; // DEFAULT FILTERING CATEGORY

edited Mar 23 '13 at 15:17

Hugo Dozois

8,147
12
54
58

answered Mar 23 '13 at 14:56

deluxedecor

1

jQuery isotope: filter on page load based on get variable

3 Answers3