Closed adam-abdulaev closed 2 years ago
There's already a CSS margin. You can scroll up manually. I'm afraid you need a tiny JavaScript hack. I'm also afraid this hack has to be implemented deep, deep in the core pdf.js library. The good news: I believe it's possible, and it's not even difficult.
This approach works:
<ngx-extended-pdf-viewer
[src]="'./assets/pdfs/The Public Domain - Enclosing the Commons of the Mind.pdf'"
(pdfLoaded)="patchScrolling()"
></ngx-extended-pdf-viewer>
public patchScrolling(): void {
if (!SimpleComponent.patched) {
SimpleComponent.patched = true;
const PDFViewerApplication: IPDFViewerApplication = (window as any).PDFViewerApplication;
const previousImpl = (PDFViewerApplication.pdfViewer as any)._scrollIntoView;
(PDFViewerApplication.pdfViewer as any)._scrollIntoView = (target: { pageDiv: HTMLDivElement, pageSpot?: any, pageNumber?: Number }) => {
previousImpl.call(PDFViewerApplication.pdfViewer, target);
if (target.pageDiv && (!target.pageNumber) && (!target.pageSpot)) {
const parent = target.pageDiv.offsetParent;
if (parent) {
parent.scrollTop -= 10;
}
}
}
}
}
I want to add a top margin after scrolling through anchor links. So that the pdf page does not fit tightly to the header after scrolling. I tried to do it via css using the usual tricks (border and negative margin, etc.), but it didn't work. The PDFs themselves have border around the page with a transparent border. I want to make it scroll to this border, or maybe some css trick can be applied. Any ideas how to do this? Thank you!
In the screenshot, I showed how I would like the document to scroll, that is, leaving such an indent on top.