How can I add a scrollbar?

I would like to fix the showing area width, and in the meantime, can scroll the pdf page if it is beyond the area width.

The way I use it now is <Document> <Page width={a fixed number} scale={a changeable number}/> </Document> . But I don’t think this is the right way. plus if fix the width in Page, I cannot zoom in/out by changing the scale.

Can you please advise?

thank you.

[ianzen]

@bfang711 , did you find a solution to add scrollbars? Is it possible to add the feature which enables drag on PDF to show the beyond area content? Which I think will provide a better user experience.

@chinalwb You can wrap the Document/Page element in a div with a specified height and style={{overflow: “scroll”}}. If the pdf element overflows this div then a scrollbar will be added. I’m currently using this approach to enable scrolling in my project with scrollbars set to hidden. Rendering multiple pages for large pdfs and getting it to interact well with scrolling is non-trivial. See https://github.com/wojtekmaj/react-pdf/issues/94

[chinalwb]

Just an update for my issue. I need to add transform: translate(0px, 50px) and overflow: scroll to the <div> under the toolbar. Thanks again @wojtekmaj for the advice and the wonderful pdf render component!