Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • #1139431

    Hi,
    i’m using Masonry Gallery for my images in my website.
    My issue is with high vertical images, that are shown with a grey lateral border: i’d like them to be shown with no border to fit complitely in the default images space, but there is no setting that allows me to do this.
    Any tips to solve this problem?
    Thanks a lot for the support!

    #1139650

    Hey Real-3D,

    Add this to quick css:

    
    .av-masonry-image-container img{
    zoom:2!important;
    }

    Best regards,
    Jordan Shannon

    #1139807

    Hi,
    thanks for the code you provided.
    I used it, i tried on a couple of computers if it was ok but on one pc the issue is solved, and on another pc the issue remains.
    I tried to use a larger number in the code, example

    .av-masonry-image-container img{
    zoom:5!important;
    }

    and the issue is soved on every end.

    The problem now is that my galleries “flicker” when opened, in particular when the images are loading.
    It seems that the problem is the animation on the images loading: if i set it on “animation deactivated” in the masonry settings the issue seems to be off. But the problem is that i want the animation to be “activated”.

    Any suggestions?
    Thanks a lot!

    #1139942

    Hi,

    Have you tried disabling active plugins and trying again?

    Best regards,
    Jordan Shannon

    #1139945

    Hi and thanks,
    no, i didn’t try to disable my plugins, because the ones i have installed is because i need them in my website and i cannot disable them.
    Any other suggestions?
    Thanks!

    #1139965

    Hi,

    Disabling the plugins will not break the site, you simply turn them back on if no culprit is found.

    I’m not seeing the flicker at all. Is it a specific browser this is occurring on?

    Best regards,
    Jordan Shannon

    #1139967

    hi and thanks,
    I haven’t tried to disable the plugins yet, but i have noticed a strange behavior: opening the website with Chrome i see the flicker issue but the images has no grey border; using Mozilla Firefox i see no flicker problem but the images are shown with the grey border, so it seems that in mozilla the CSS doesn’t have effect…
    How can i proceed?
    Thanks and best regards

    #1141205

    Hi,

    Thank you for the update.

    We don’t really see any flickering in that page. For the image size, please remove the zoom property and try this one instead.

    .av-masonry-image-container img {
        object-fit: cover;
    }
    

    // https://css-tricks.com/almanac/properties/o/object-fit/

    Don’t forget to toggle the Performance > File Compression settings afterwards.

    Best regards,
    Ismael

    #1141289

    Hi and thanks.
    The images are now ok, i tried to clean my browser cache and now they fit in the space with no border (using the first code provided by Jordan).

    Now i need to adjust the “flickering” issue in the loading of images…
    I link in the Private Content here a video where I marked the “flickering” errors with a “NOW” written.
    I hope you understand now the issue: I don’t mean the animation, that is ok, but the fact that the images seems to disappear and reappear in a split second several times…
    Thanks for the support and best regards!

    #1142101

    Hi,

    Thank you for the update.

    We can’t reproduce the flicker on Firefox Windows 10. Have you tried checking the site on a different computer? What is the actual specs of the laptop/desktop where you check the site?

    Best regards,
    Ismael

    #1142146

    Hi Ismael and thanks,
    yes, with firefox the problem does not exist, i tried with it and everything is ok.
    The problem is using Google chrome.
    I tried on a couple of computers where i run chrome: the first PC is an ASUS ROG laptop (g752vsk) and the second is a workstation. I think that the problem is not in the computers (because they’re all updated and powerful) but maybe is related to the software Google Chrome…
    Can I maybe adjust the CSS provided, or is there another way to solve the problem?
    Thanks a lot for the support and best regards.

    #1142572

    Hi,

    Thank you for the update.

    We checked the site on Chrome Windows 10, but we are still not able to reproduce the issue. Did you remove the css code? The items don’t flicker on load.

    Best regards,
    Ismael

    #1142611

    That’s strange, i’m using Chrome on Windows 10 and the issue is right here… :(
    I didn’t remove any CSS because the last provided solved the problem with images to fit in the space with no border.
    Is maybe there a plugin for images to be shown like masonry gallery but without this issue?
    Thanks and best regards.

    #1143203

    Hi,

    Thank you for the update.

    Have you tried testing it on another computer? We checked the site again today on Chrome Windows 10 and we don’t see the “flicker” issue. We even tested it on incognito mode. If you want to use a plugin instead, try these.

    // https://wordpress.org/plugins/simple-masonry-gallery/
    // https://wordpress.org/plugins/photoswipe-masonry/

    Best regards,
    Ismael

    #1143244

    Hi,
    I tried on my 2 computers only, but the problem is still here…
    I’ll try the 2 plugins suggested, hope one of them will be good for me!
    Thanks again and best regards!

    #1144030

    Hi,

    Alright. Let us know if you need more help. We’ll keep the thread open.

    Best regards,
    Ismael

Viewing 16 posts - 1 through 16 (of 16 total)
  • You must be logged in to reply to this topic.