Tagged: , , , ,

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • March 18, 2020 at 2:59 pm #1194127
    ATB_IO

    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.

    March 19, 2020 at 6:41 pm #1194506
    Victoria

    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

    March 19, 2020 at 7:12 pm #1194533
    ATB_IO
    This reply has been marked as private.
    March 20, 2020 at 7:11 pm #1194869
    Victoria

    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

    March 20, 2020 at 7:50 pm #1194903
    ATB_IO

    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

    March 30, 2020 at 2:15 am #1198975
    Mike

    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

    March 30, 2020 at 4:04 pm #1199096
    ATB_IO

    Brilliant, works a charm! Thanks Mike :)

    Best regards.

    March 30, 2020 at 7:30 pm #1199167
    Jordan Shannon

    Hi,

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

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Add custom class to individual Masonry Gallery elements’ is closed to new replies.