Hello! I'm using isotope in a view with format "isotope grid" on my website (mescalinadesing.it).
The problem is that in the homepage the images are overlapping each other. This happens just in Chrome and Safari browser and only on the first page load. If you "reload" the page by clicking on the logo, then the images display correctly...
I have to fix this problem...

Anyone can help please?

Thank you!

Comments

symphonia’s picture

Status: Active » Fixed

Solution found:

in second line of modules/isotope views/isotope_views.js
put
$(window).load(function() {

instead of
$(document).ready(function() {

theodorosploumis’s picture

StatusFileSize
new279 bytes

Here is the patch. Small but usefull for maintainers.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

siva.thanush’s picture

Version: 7.x-1.x-dev » 7.x-1.0-beta2
Component: Documentation » Miscellaneous

I have the same issue with -beta2.
The patch here doesn't work for me.

granticusiv’s picture

Issue summary: View changes

That patch doesn't work. The problem definitely seems to stem from the fact that the jQuery is called before the HTML has been rendered, hence why it only happens the first time round. Second time around, the HTML has usually been cached by the browser.

I normally call external libraries like this after the body in the template, but because this library is called from within the module, I don't know how to change it. Any suggestions?

Edit: I moved the <?php print $scripts; ?> below the Body and it didn't help, so I guess the solution still lies in changing the code to make sure the HTML has finished rendering?

Edit 2: That patch does work, if Colorbox module is disabled