Layout of masonry wrong with Safari
Permalink Browser Info Environment
Hi
I found there is a problem with the isotope/masonry plugin in general. In Safari the layout won't be rendered correctly on page load. Once you resize the window until the container has to be redrawn, the items are ordered correctly.
I have attached a screenshot which shows the problem on your preview site.
I had to set a timeout of about 1s before the "layout" function is triggered:
That way it works but of course this is kind a hack and maybe you find a better way to fix it.
Chris
I found there is a problem with the isotope/masonry plugin in general. In Safari the layout won't be rendered correctly on page load. Once you resize the window until the container has to be redrawn, the items are ordered correctly.
I have attached a screenshot which shows the problem on your preview site.
I had to set a timeout of about 1s before the "layout" function is triggered:
$win.on('load',function(){ window.setTimeout(function(){ $isotope = $container.isotope({ masonry: masonryOptions, itemSelector: '.masonry-item' } ); $isotope.isotope('on', 'layoutComplete', function (items) { loadVisible($imgs, 'lazylazy'); }); $win.on('scroll', function () { loadVisible($imgs, 'lazylazy'); }); $imgs.lazyload({ effect: "fadeIn", failure_limit: Math.max($imgs.length - 1, 0),
Viewing 15 lines of 19 lines. View entire code block.
That way it works but of course this is kind a hack and maybe you find a better way to fix it.
Chris
| Type: | Ticket |
|---|---|
| Status: | Archived |
Thanks a lot !
Did you have a url where i will see the gallery with the fix ?
Did you have a url where i will see the gallery with the fix ?
I just sent you the link by a private message, as the project isn't yet ready for the public.
Chris
Chris
Hi,
YOu're right the main issue come from :
But without this, when we use filtering, the container height change is abrupt. I will need to investigate.
YOu're right the main issue come from :
.easy-gallery-masonry { transition:.3s; }
But without this, when we use filtering, the container height change is abrupt. I will need to investigate.
Attention: Since there has been no activity on this issue for two weeks, this issue has been automatically archived.
To re-open this issue, reply to this message.
To re-open this issue, reply to this message.
1. in masonry.php add the following when setting the layout:
and the main problem sits in the view.css file on the following line:
I removed this line and it seems to work now. Can you test this and add it to the package?
Chris