How to attach scroll event on FancyBox

I have a big fancybox popup and contains scroll, And I need any event to attach scroll on this fancybox popup.

I'm already try some events like:

$('.fancybox-inner').off("scroll").on("scroll", function(){debugger;});

OR

$('#FancyBox').off("scroll").on("scroll", function(){debugger;});

and other ways, but nothing work.

is there anyone have a idea ?

1 answer

  • answered 2020-10-22 09:12 Rory McCrossan

    The Fancybox content is dynamically generated. As such you'll need to use a delegated event handler for the scroll event:

    $(document).on('scroll', '.fancybox-inner', function() { 
      debugger;
    });
    

    Alternatively you could manually add the scroll event when the FancyBox is displayed using the built in events it exposes:

    $('#yourFancyBox').fancybox({
      afterShow: function() {
        $('.fancybox-inner').on('scroll', function() {
          debugger;
        });
      }
      // other settings...
    });
    

    You can read more on the events available within the Fancybox library by reading their documentation