1

I've introduced an <embed> element on my web page for a PDF, it was kind of a weird work around with the web software I'm using but it works fine on a PC. But when I go on mobile it won't scroll at all, it almost looks like the front page of the PDF is just a stationary image on the webpage.

The OS is IOS.

(note: the reason I'm using embed and object is because I want the PDF to display on the webpage without a user having to click a link and be redirected.)

Below is the code I used.

!DOCTYPE html
<html>
  <header>
 <meta name="viewport" content="width=device-width, initial-scale=1">
 </header>
<head>
<style type="text/css">
html { 
   overflow: auto; 
   -webkit-overflow-scrolling: touch; 
}
body {
   height: 100%;
   overflow: auto; 
   -webkit-overflow-scrolling: touch;
   margin: 0;
   padding: 8px;
}
</style>
</head>
<body>
 <object data="https://assets.site-static.com/userFiles/3377/file/Seller_Guide_Final_Use_3822.pdf" type="pdf">
    <embed src="https://assets.site-static.com/userFiles/3377/file/Seller_Guide_Final_Use_3822.pdf" width="350" height="500" />
 </object>

<script>
$("#iframe").contents().find("body").css({
   "height": "100%",
   "overflow": "auto", 
   "-webkit-overflow-scrolling": "touch"
});
</script>
</body>
</html>
Snubaa
  • 11
  • 2
  • What O/S? As you can see in [posts like this](https://stackoverflow.com/questions/15854537/make-embedded-pdf-scrollable-in-ipad) the problem has existed for years on iOS. There are workarounds besides telling your users to only use Android. – stdunbar Mar 22 '22 at 22:29
  • @stdunbar I'm using IOS – Snubaa Mar 22 '22 at 22:44
  • @KJ The reason I don't want to use a href is due to the fact I want the PDF to show up on the webpage itself rather than showing a link for the user to click. – Snubaa Mar 22 '22 at 22:44

0 Answers0