Iframe responsiv gestalten?

[Rolf B]

Hallo Jörg,

bei einem iframe mit einer pdf-URL darin ist das sinnlos. Die Darstellung eines solchen iframe ist in den Browsern total unterschiedlich.

Im Firefox finde ich ein verzweigtes HTML Dokument.

In Chrome finde ich lediglich ein <embed> Element.

In beiden ist es so, dass die PDF Anzeige den iframe in ganzer Größe ausfüllt. D.h. du kannst die Größe gar nicht abfragen, weil die PDF-Anzeige sich am iframe orientiert. Beim Firefox könntest Du versuchen, in das HTML der PDF-Anzeige hineinzugreifen, da gibt es Stellen, wo eine Größe zu finden ist. Aber eine 100%-skalierte DIN-A4 Seite ist für die meisten Bildschirme an der Größengrenze und ein Mobilgerät ist definitiv überfordert, so dass dein iframe größer wird als der Bildschirm.

Und Chrome/Edge hängen Dich sowieso ab.

Wenn der User mobil auf die Seite zugreift, nutze ich eine js-pdf-viewer Bibliothek, damit das PDF im Browser dargestellt wird anstelle eines PDF-Downloads.

Das mag was anderes sein. Der output dieser Bibliothek ist dann auch in einem iframe? Dann beschäftige Dich mit dem DOM, dass diese Bibliothek erzeugt, vielleicht geht da was. Der Zugang erfolgt über die contentDocument-Eigenschaft des iframe-Objekts, und ab da kannst Du mit querySelector weiter suchen. Oder getElementById, je nach Lage der Dinge. Voraussetzung ist, dass Hostdokument und iframe-Dokument die gleiche Herkunft haben (Same-Origin-Policy).

Rolf