Tagged: color section, flickering, gallery, Masonry Gallery, scrollbar
-
AuthorPosts
-
April 17, 2019 at 1:47 pm #1092004
Hi there!
This is a long-time annoyance that I could never fix with Enfold masonry galleries…
If I limit the gallery to show fewer images than there are and add a “load more” option – clicking the button starts shaking the browser window or starts flickering the scrollbar. If I try to scroll while the window is shaking and scrollbar is flickering (before images load) – I can no longer scroll once the images are loaded – I must click on the browser window again and only then can I scroll.Can this be fixed at all? It’s very annoying and looks nasty :/
As an additional problem – how do I remove the 1px bottom border that gets added with every full-width “color section” element? There are no options for it anywhere and that 1px border annoys me to hell and back (even though the code seems to suggest it’s set to 0px!). The border appears if you add anything below the color section element, such as a separator or a gallery, that isn’t in another color section. Two color sections one after the other seem to be fine.
Thanks!
Here’s a video of the problems (first part is the shaking, the other is the border): https://youtu.be/zgkRFGusJi8
Hope this helps visualize what I’m talking about.April 19, 2019 at 10:14 pm #1092757Hey clikcreations,
Your web site URL?
Best regards,
BasilisMay 2, 2019 at 11:40 pm #1096650Thank you for asking that, clikcreations. I’ve always noticed this as well and it looks unprofessional which is why for the longest time I would not add a “Load More” option.
I have a feeling if there’s a solution for this it’s going to come from a theme update, but if anyone out there knows of a fix please post it.
Thanks,
BrianMay 3, 2019 at 11:19 am #1096865Hi!
I’m the same problem : https://www.loom.com/share/b9433450a3044619a7408c4b9523c7f0
By clicking “load more” or in categories
Thanks by fixed that problemMay 4, 2019 at 12:27 pm #1097168Hi boiteamedia2018,
Could you please give us a link to your website, we need more context to be able to help you.
Which browser are you using?
Best regards,
VictoriaMay 6, 2019 at 7:13 pm #1097781Hi Victoria,
I notice the issue on my pc when using both chrome and firefox browsers. On my ios phone however the issue does not appear to be there.
Thanks,
BrianMay 7, 2019 at 9:00 pm #1098196Hi,
Thank you for contacting us.
This issue is usually related to the cached files on your site or the .htaccess file.
Please check this link for more info.
Please deactivate all plugins and check the browser console for any error message.
We await your reply the test results.
Best regards,
VinayMay 7, 2019 at 10:23 pm #1098225Hello Vinay,
Thank you for the response.Like clikcreations mentioned in the first post, when I click “load more” I am also experiencing shaking of the page and flickering of the scrollbar, but unlike clickcreations I can scroll immediately after the images load.
I followed your link to the “Failed to load resource: the server responded with a status of 403” page but I’m not sure that’s of much help. Again, the images load but they do so following a shaking of the page and flickering of the scrollbar.
I started building my enfold site almost 6 years ago and although I don’t remember exactly when I first attempted to use the “load more” feature I do remember this issue has always been present when viewing my site on pc via both chrome and safari browsers. As I mentioned in a previous post I have never seen the issue using an ios phone. Furthermore, I have viewed the site on 3 different pc laptops as well as 2 different pc desktops and issue appears the same in all instances.
I followed your advice and deactivated all plugins before clearing my entire cache, I received no browser error message but the issue still persists.
Thanks,
BrianMay 8, 2019 at 9:25 am #1098382Hi Victoria
please, check this link
I try the page using Chrome, Firefox and Edge
The problem of shake caused by the bouton “load more” is subtil but when I choose one categorie for do sorting, all images move to the top.
I checked : no cache plugins active.
Thank youMay 9, 2019 at 9:14 am #1098802Hi,
Thanks for the update.
The following css code should fix the issue temporarily.
.avia_loading_icon { display: none !important; }
We haven’t figured out what actually causes the issue, but the css code above should stop the “flickering”.
Best regards,
IsmaelMay 13, 2019 at 8:07 pm #1100251Thanks Ismael, that fixed it. I added the code to the Quick CSS and then cleared my cache.
Hopefully you can figure out what causes it. Here’s something interesting that may help you…the issue still persists when I view that site in incognito mode (I’m using Chrome of course). That doesn’t really matter to me, but again it may help you figure out what’s going on.
Appreciate the help,
BrianMay 15, 2019 at 11:04 pm #1101180Hi,
Can you disable the Theme Optimization settings of our theme please?
Best regards,
BasilisMay 16, 2019 at 11:50 am #1101395Hi! Sorry for the very late reply, I was caught up with other work and then went on holiday :)
Anyway, the question about the website URL was a bit funny, since it’s right there in the video, but then I realized I’d enabled the construction mode on it… oops! Guest login in the private field below, if still needed.
Good to see I’m not alone with this issue! It was bothering me ever since we got into Enfold! As Brianbu mentioned – the issue is OLD, so it’s about time it got fixed.
The CSS code provided seems to have sorted the shaking and flickering, which is awesome! Thanks for that – hopefully you guys will find what is causing it and apply the fix in an update :)The 1px border issue is not gone, however. Easily replicated by putting an element (such as a whitespace or anything else) outside of or between the Layout Elements. I guess we’re supposed to always use these layout elements as containers..? Still annoying.
Another issue I have is that if I wanted the masonry gallery to fill the browser width I start getting very ugly white sides on my pictures. This, in essence, limits the possible website width to just above the default value in Enfold – going wider starts introducing the ugly white edges on the gallery: https://imgur.com/jczOoIM – not gonna work if you want to create a fully flexible website/gallery.
On top of that there’s the blur that happens when hovering on any image. It would be nicer to have some control over the thumbnail size/filtering, since as it stands now – it would not be acceptable for a website displaying critical imagery (photography, graphic design, etc).
The issue is not present if the “perfect grid” setting is used, only in “flexible” mode. But the masonry gallery’s main appeal IS the flexible mode, so it needs sorting.- This reply was modified 5 years, 7 months ago by clikcreations.
May 21, 2019 at 11:13 am #1102798Bump, been 4 days
May 27, 2019 at 5:15 am #1104416Hi,
We are very sorry for the late reply.
1.) Is there a test page where we can see the 1px border issue? A screenshot will help as well.
2.) We can’t reproduce the issue in the gallery. The current container limit is set to 1310px and the masonry images are displaying as they should.
If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.
Thanks!
Best regards,
IsmaelJune 6, 2019 at 5:30 pm #1108007Hi!
1) Link posted in private below. Super easy to recreate… As I’ve mentioned in my last reply: “The 1px border issue is not gone, however. Easily replicated by putting an element (such as a whitespace or anything else) outside of or between the Layout Elements.”
2) Issue also reproduced in the test page. When the container is wider than 1310px – everything breaks. Masonry no longer follows the shape of the image and adds a white background. Well, the white background is an issue all on its own anyway, because images with transparency are not being displayed properly…EVER. Why does Masonry Gallery even need a white background? Should be permanently transparent, as far as I’m concerned – would solve so many issues….
I’m keeping this as relevant as I can, however with the reply speed here (once or twice a week if we’re lucky – admitedly I stop coming back too because it’s so slow to get anywhere, hence my own late replies) – is it really good advice to keep splitting everything into even more topics? If I have 2 or 3 issues with the masonry gallery, I sort of expect to be able to list them all as I go, but it might just be me. Thanks anyway.
June 11, 2019 at 3:11 am #1108959Hi,
Thanks for the update.
1-2.) This should adjust the size of the masonry image and get rid of the white border.
.av-masonry-image-container img { width: 100%; object-fit: cover; }
Sorry for the delay. We ask users to avoid including multiple questions in a single thread, however closely related they are, so that other users can effectively search the forum. And to keep the thread as short as possible. Thank you for understanding.
Best regards,
Ismael -
AuthorPosts
- You must be logged in to reply to this topic.