在中收听滚动事件<object>

Question

I have a PDF in an HTML object tag like so:

<object type="application/pdf" data="https://termsfeed.com/assets/pdf/privacy-policy-template.pdf"></object>

and I would like to run some code when the PDF is scrolled. However, attaching a scroll event listener to the object element doesn't work. What is the correct way to get this working?

Answer 1

listen to the scroll event of container html element instead of pdf

<div id='pdfContainer'>
   <object type="application/pdf" data="https://termsfeed.com/assets/pdf/privacy-policy-template.pdf"></object>
</div>

$('#pdfContainer').on('scroll', function () {
        alert('scrolling');
    });

Answer 2

 document.getElementById('pdfContainer').addEventListener('scroll', function () { console.log('scrolling'); }); 

 object { height: 1200px; } #pdfContainer { height: 500px; overflow-y: scroll; } 

 <div id='pdfContainer'> <object type="application/pdf" data="https://termsfeed.com/assets/pdf/privacy-policy-template.pdf"></object> </div>