Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #520791

    Hello,

    I’d like to disable masonry gallery lightbox on our Gallery page for mobile phones (screen width < 768).

    I found somewhere that you can add “noLightbox” class to an image to prevent it from opening in the lightbox. However, it doesn’t work in masonry gallery.

    To which element do I have to add “noLightbox” class so that the image wouldn’t open in lighbox?

    I plan to add the “noLightbox” class with jQuery. If you have a better solution, please share.

    #521150

    Hi lapajnea!

    I’m not sure if this CSS works for mobiles but we can try it.

    @media screen and (max-width: 767px) {
    .av-masonry-container a {
        pointer-events: none !important;
    }
    }

    Best regards,
    Elliott

    #521388

    Oh, I think I wasn’t clear enough. I DON’T want to disable clicks on the images.

    When clicked on an image in masonry gallery on mobile, I want to show the image normally, instead of showing it in lightbox.

    #522013

    Hi!

    Hmm, we can disable it on both desktop and mobile but I’m not sure about only mobile, that is probably going to be quite difficult.

    Best regards,
    Elliott

    #522141

    Using the “noLightbox” class doesn’t apply in this case?

    #523078

    Hey!

    It would disable it for both desktop and mobile.

    Regards,
    Elliott

    #523468

    Why? I’d add it with jQuery just for smaller screens.

    Just tell me which element I need to add that class to.

    • This reply was modified 9 years, 1 month ago by lapajnea.
    #523954

    Hey!

    The magnific popup will select all images surrounded with a link so you just need to target the link surrounding each image. If you view your source code you’ll see the link has a class of “av-masonry-entry” so you can use that to target them.

    Regards,
    Elliott

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