CODEWITHSUNDEEP
javascriptjqueryhtmlcsslayout
RyanP13
RyanP13

Reputation: 7743

jQuery Isotope does not maintain layout

I am using jQuery Isotope for my personal website:

http://www.ryanpays.com

The issues i am facing are when a user clicks either 'Websites' or 'HTML-Email' after the page has loaded there is no animation of the project thumbnails when filtering. However, they do animate when either link is clicked again.

Also i would like to preserve the layout of the 'Clients and projects' section after the animation. It seems to break onto a new row/s when there should be enough room for the last child to be positioned on the first row. When 'show all' is clicked it does not return to the original layout either. I am unsure if there is something i need to do in the CSS to achieve this or maybe re-structure my HTML.

Update

I have worked around this issue by initialising isotope on page load and then again on click. Doesn't look right in IE6 (can live with that for now) and is not really the functionality i would ideally like to achieve.

Upvotes: 0

Views: 1342

Answers (1)

Mac Tyler
Mac Tyler

Reputation: 26

You need to set your #UL to #UL.isotope because it is adding that class on click, and it needs to already be applied for the css3 animations to work. Just had this issue today, www.mactyler.net you can see it working.

Upvotes: 1

Related Questions