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
8
votes
3 answers

How to center items inside isotope container?

I have an isotope grid with a non fixed width and I dont know how to center the items inside the isotope container. .box{ width: 40px; height: 40px; background-color: #e74c3c; margin: 0 auto; } that css fails to center the items. here is the link…
Anfa A
  • 173
  • 1
  • 2
  • 9
8
votes
1 answer

Two methods of looping through Ajax requests for jQuery Then When - which to use?

I've got a deceptively simple blog project in the works, where I'm trying to bring together Isotope Jquery (for layout/filtering/sorting), Infinite Scroll, and dynamic loading of all blog excerpts via Ajax (so filtering and sorting is applied to all…
Isaac Gregson
  • 1,325
  • 1
  • 14
  • 27
8
votes
3 answers

Isotope folded (elements overlap)

I have been reading stack overflow for a solution but can't find it. (full size image at http://i.imgur.com/hrcDg.png) When I load the page it looks like that Here is the site (beta) http://e-gimnazija.hostoi.com/test/site/index.html If you press…
Maverick
  • 858
  • 1
  • 10
  • 20
8
votes
2 answers

Why is typing in a textarea in firefox causing the screen to scroll?

I am experiencing an incredibly bizarre issue with the isotope plugin in firefox only. I have a textarea in each of my isotope elements and when I scroll down to the bottom and type in one of the textareas, the screen jumps to the top. I have…
threejeez
  • 2,284
  • 6
  • 29
  • 50
8
votes
2 answers

Modernizr causes errors with jQuery Isotope

I'm trying to add Modernizr to this page: http://www.alternativeradio.org/pages/test. Modernizr works fine and does its job on other pages of this site. But on this page, which uses jQuery Isotope, adding:
Zade
  • 682
  • 7
  • 26
7
votes
2 answers

Use Isotope library in a fixed-height container?

I am using Isotope for a project. We bought a commercial license. I need to get the isotope tiles in a fixed-size container (height is especially critical) to work within a larger layout. I tried setting css height on the container:
Steve
  • 12,696
  • 26
  • 104
  • 191
7
votes
0 answers

jQuery Isotope - Not working within a responsive/fluid grid

I am in the process of building a photoblog which utilises the brilliant Isotope plugin by David DeSandro but I am curently having some difficulty getting the plugin to work as intended within a responsive / fluid grid. www.lewismalpas.co.uk/tumblr…
7
votes
1 answer

jQuery Isotope Possible Chrome Bug?

I'm using jQuery Isotope to fill in the spaces on a multi-width multi-height grid (equal proportions). The grid is sorted using ui-sortable with a button to toggle back to Isotope after sorting. There are some sort orders that leave empty blocks. …
Chris_O
  • 3,381
  • 1
  • 18
  • 26
7
votes
5 answers

Callback for jquery plugin Isotope

I'm using isotope ( http://isotope.metafizzy.co ) with expandable items, and i would like to use ScrollTo so that i can automatically scroll to the newly expanded item.. I first tried to use the callback with the reLayout method, something…
skiplecariboo
  • 782
  • 1
  • 8
  • 21
7
votes
2 answers

Reapplying jquery-match-height after isotope grid is filtered

I am using jquery-match-height to match the heights of an inner div inside the grid items of an isotope layout, and this is working perfectly when the isotope grid loads. However when I filter the grid, the divs are no longer being processed by the…
mayersdesign
  • 4,231
  • 4
  • 27
  • 44
7
votes
5 answers

Hairline gaps between items in isotope-packery on window resize

I am having a small issue with my isotope-packery layouts, where a very thin 1px or less line is appearing between certain items at some window sizes. Is there a way to eliminate this hairline gap? Example: http://i.imgur.com/6jkqhZw.png (look…
Drawcard
  • 69
  • 3
7
votes
3 answers

Masonry: remove gutter from last column

Been working with the new version of Masonry which seems to work much smoother, especially for the fluid/responsive build I am doing. One issue I have encountered, however - I am not sure how to remove the gutter on the far right of the .masonry…
iamkeir
  • 2,429
  • 2
  • 16
  • 21
7
votes
2 answers

isotope reorder after search not working

I've integrated a jquery search plugin to search through isotope elements, the plugin uses regular expression to sort content, in real-time, based on the search input. Isotope elements are updating automatically ( I'm using a wordpress plugin…
agis
  • 1,709
  • 9
  • 32
  • 63
7
votes
4 answers

Using Masonry, jQuery, and PHP to make an album cover gallery

I read about Masonry and after failing to get image appending to work was advised to switch to the successor Isotope. I was trying to improve or create variations on an album cover gallery, something I've done once or twice before using the same PHP…
Muskie
  • 567
  • 3
  • 21
7
votes
3 answers

Isotope + Lazyload: image size

Two things to keep in mind before I expose my problem: 1. I'm not a programmer, therefore I have NO IDEA of what I'm doing 2. Talk to me like I'm stupid, and be very very patient (see 1.) Alright, there are about a million things wrong in the way…
hooverfocus
  • 131
  • 1
  • 6