1

I'm having problems with a website that uses isotope and loads all it's contents with ajax. I run the isotope script after the ajax call and it's running fine. The problem is that the elements are placed in a single column. The only way I found to relocate them is resizing the window to make isotope run again. Do you know which can be the problem?

This is my isotope function called after the ajax call:

jQuery('.products').isotope({
        itemSelector: '.products li',
        masonry : {
        columnWidth : 40
    }
});

This is a link to my site to see the problem in first person http://ves.cat/bpdT. Click on the logo and you'll see that after reloading the homepage with ajax the product thumbnails are in a single column, not like the start. If you resize the window, then it's ok, the thumbnails go back to their correct position.

I also tried to write jQuery('.products').isotope('reLayout'); after the isotope function but it didn't work also.

Thanks in advance!

andreu
  • 105
  • 3
  • 10
  • Your link goes to username/password input, so one can't look at it. You are using Ajax to load images into an empty Isotope #container on load? – Systembolaget Oct 24 '12 at 05:29
  • Ok sorry, you can visit it now. With Ajax I'm reloading all the content in the `#container`. The isotope `.products` element is inside the `#container`, but sometimes is not the only element, it have other images and text. – andreu Oct 24 '12 at 11:00
  • @Systembolaget do you have any idea of what's happening? I've been testing this morning without any good result :( – andreu Oct 25 '12 at 17:00
  • When I open your page in Chrome, Firefox and Safari (all in OSX), the Isotope layout works, also when resizing the window. If I then go to "Company" and back, only then the single row layout error shows. There are many external scripts, because you're using WP for your site; there could be conflicts. Have you tried it the regular way; building your site with Isotope and Ajax so it works - and then adding all additional effects etc. one after the other - so you have an overview when it starts to malfunction? Typical idea http://stackoverflow.com/a/9657833 or http://stackoverflow.com/a/10973617 – Systembolaget Oct 25 '12 at 18:49
  • I could resolve it using a timeout function of 100ms, with this, the isotope script is the last one launched and it works fine. It's not the best solution but it does the job. Thanks for your comment, it helped me to understand the real problem :) – andreu Oct 27 '12 at 17:13

0 Answers0