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

    Hi there,

    I’m experiencing the same problem as reported here: https://kriesi.at/support/topic/lightbox-stop-from-scrolling-up-upon-opening/#post-1009023.
    In short, the page scrolls up by a small amount when a custom Lightbox is opened.

    However the solution, add .no-scroll class to the popup link won’t work for me, as the popup link is buried in a Masonry Gallery element, which I can only add a custom link to, i.e no html or classes etc. So the question is how to add custom class to that tag?

    Many thanks.

    #1194506

    Hey ATB_IO,

    Could you please give us a link to your website, we need more context to be able to help you.

    Best regards,
    Victoria

    #1194533
    This reply has been marked as private.
    #1194869

    Hi ATB_IO,

    You added an anchor link to the first masonry item, the browser thinks there is an element on the page with that id and tries to scroll to it. The no-scroll you added with a dot and it does not work in the html like this.

    https://share.getcloudapp.com/qGuo64mJ there should be no buttons here. Please remove.

    Best regards,
    Victoria

    #1194903

    Hi Victoria,

    My mistake with the dot – it doesn’t work anyway, as it places the class into the wrong container.
    I added the anchor link in the Custom Link option of the masonry item, as it was the only means I could find by which to trigger the popup to open from a masonry element. If this is causing the scrolling issue, would you have a better means of launching the popup?

    https://share.getcloudapp.com/qGuo64mJ there should be no buttons here. Please remove.

    I’m afraid I don’t understand what buttons you are referring to.

    Many thanks

    #1198975

    Hi,
    Sorry for the late reply, to add the class “no-scroll” to your masonry element try adding this code to the end of your functions.php file in Appearance > Editor:

    function custom_script(){
      ?>
      <script>
    (function($){
      $(document).ready(function(){
        $(".av-masonry-entry").addClass('no-scroll');
    });
    })(jQuery);
    </script>
    <?php
    }
    add_action('wp_footer', 'custom_script');

    Then clear your browser cache and check.

    Best regards,
    Mike

    #1199096

    Brilliant, works a charm! Thanks Mike :)

    Best regards.

    #1199167

    Hi,

    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘Add custom class to individual Masonry Gallery elements’ is closed to new replies.