Questions tagged [jquery-isotope]

Isotope is a client-side jQuery plugin that allows masonry-style grid and table layouts, along with data sorting and filtering, to enable dynamic relayout of elements on a page.

Isotope has similarities to Masonry and Packery; in fact, it utilizes both and adds sorting and filtering capabilities.

This library is distributed with two distinct licenses: open source (GPLv3) and commercial.

Useful Links:

1675 questions
11
votes
1 answer

How to edit / remove `show all` view in isotope library?

There are two others topics about this, but they don't help me. I have this html:
11
votes
7 answers

jQuery isotope on first load doesn't work, How do I wait for all resources/images to be loaded?

I've got something I've put together using jQuery isotope here.. http://jsbin.com/eziqeq/6/edit It seems to work in general but on first load, of a new tab, the Isotope plugin is setting the height of the wrapper element to 0. If I refresh the page…
Keith Mason
  • 145
  • 1
  • 1
  • 8
11
votes
1 answer

Lazy Load + Isotope

I've spent considerable amount of time trying to get isotope and lazy loading working together. The issue: lazy loading works if the user scrolls down, however if the user uses the filters, the items show up on top but the images will not load. Here…
David Garcia
  • 2,510
  • 17
  • 48
  • 85
11
votes
2 answers

Jquery Isotope : How to fill empty gaps?

I've tried basically every single hint / tip / advice to achieve that, but still, I got these empty ugly spaces while using Isotope. Here's a demo showing the problem I'm experiencing. You see these blanks? Is there any jquery code to make the…
Adame Doe
  • 311
  • 1
  • 3
  • 12
10
votes
3 answers

jQuery Isotope — Centered and Fluid/Responsive

I am asking a question about Isotope It is a great plugin for jQuery. I have been playing with it for a while now, but I don't know enough about javascript to combine two of the Isotope techniques, responsive Isotope and centered Isotope. I have…
davecave
  • 4,314
  • 5
  • 23
  • 32
10
votes
2 answers

Filters + Search with Isotopes Breaks Search?

I am using Isotopes (v1) and have created a search field following an example in a Pen. Initially it works, however, if I filter the Isotope gallery then the search field stops working. I believe the search function still runs just doesn't filter…
L84
  • 42,350
  • 55
  • 167
  • 243
10
votes
5 answers

Is there a way to target the first and last element in each row using jQuery isotope?

I have an masonry isotope grid that has n number of rows with two column sizes: 160px by 160px and 320px by 320px and I'd like to assign different styles to the first and last element of each row. My rows could have anywhere from 4 elements to 7…
mike
  • 2,510
  • 6
  • 29
  • 46
9
votes
3 answers

how to deal with large data sets with jquery isotope

I am planning on using the great isotope plugin for displaying a list of contacts and then allowing them to be filtered. The issue I have is that it works great for a small data set but i'm not sure the best way of scaling it up for 1000+ pieces of…
Josh
  • 5,998
  • 1
  • 31
  • 54
9
votes
1 answer

isotope - 'no results' message?

I'm using the Isotope JS plugin (v2.0.1) from Metafizzy to filter a library of publications, and I am using more than one filter (e.g. publisher and industry). Is there a way to check if my combination of filters has resulted in zero results, and…
BellamyStudio
  • 741
  • 1
  • 9
  • 22
9
votes
1 answer

ScrollReveal.js — Reveal All items on Click or Event?

Is there a way to reveal all items with scroll reveal with a click event? Perhaps a reveal all function? Problem: I am using scroll reveal as well as Isotope. The sorting functionality of isotope reacts strange with scroll reveal. When I click a…
9
votes
1 answer

React components lifecycle, state and redux

I would like to use redux to store the state of my whole react application, however I am stuck with a particular case: what to do with redux when the component needs a local state, modified by lifecycle methods like componentDidUpdate or…
mguijarr
  • 6,884
  • 4
  • 37
  • 67
9
votes
2 answers

jQuery Isotope RTL

I'm using this code to run Isotope with RTL support $.Isotope.prototype._positionAbs = function( x, y ) { return { right: x, top: y }; }; $('.portfolio-isotope').each(function() { var layoutMode = $(this).attr('data-layoutmode'); …
lior r
  • 2,020
  • 6
  • 38
  • 78
9
votes
4 answers

Large Isotope Gallery is Very Slow

I have an Isotope gallery (version 2) with almost 400 elements. A typical gallery item looks like this:

H

Name

No Info…

L84
  • 42,350
  • 55
  • 167
  • 243
9
votes
3 answers

jquery Isotope option for auto height on element

So I'm using the isotope masonrylayout $('section').isotope({itemSelector:'article',layoutMode:'masonry',transformsEnabled: false, animationEngine: 'jquery',masonry:{columnWidth:8}}); The problem is that if I don't set the height for the article in…
Uffo
  • 8,424
  • 20
  • 78
  • 148
8
votes
2 answers

Problem with poor font rendering with CSS3 transitions, jQuery, & Google Fonts

In Firefox, there is no problem. Here's an image: http://cl.ly/3R0L1q3P1r11040e3T1i In Safari, the text is rendering poorly: http://cl.ly/0a1101341r2E1D2d1W46 In IE7 & IE8, it's much worse, but I don't have a picture. Sorry :( I'm using Isotope…
Justin
  • 143
  • 2
  • 7