PDF doesn't have scroll bars on apple products.

PDF doesn't have scroll bars on apple products.

by Cindy Weber -
Number of replies: 9
Moodle 3.11.4+ 
I have embedded a multi-page pdf (hopefully multiple pdf's with quizzes in between) in the HTML course editor (lesson activity) using this code: <center><embed width="95%" height="600" src="https://LINK.pdf" scrollbar="1&quot;" /></center>  I am using Boost with "Enable device detection" Yes. 3.1.
1. On a mac, it shows a long scroll bar that I can click on - but not scroll - to move to the next page. It is not obvious that there are multiple pages. It also freezes the computer (and nothing freezes on that computer).


2. On an Iphone, it shows only the first page with no evidence of a box or scroll handles. 3. It shows fine on a PC. 



I have read a lot of posts about embedding PDF's but none about how to embed the PDF and get it to show up properly on all devices.
Does anyone have any advice for me? Thank you!

Average of ratings: -
In reply to Cindy Weber

Re: PDF doesn't have scroll bars on apple products.

by Mark Johnson -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

If you are embedding the PDF manually rather than having a filter do it for you, try adding style="overflow:scroll;" to the <embed> tag.

In reply to Mark Johnson

Re: PDF doesn't have scroll bars on apple products.

by Cindy Weber -
Thank you Mark!
The Imac is still freezing and both the iphone and mac still look the same.
Does this look like your suggestion? It there somewhere I should be trying this that would tell me when I messed it up?

<center><embed width="95%" height="600" src="https:LINK.pdf" style="overflow: scroll;" scrollbar="1&quot;" /></center>

I thought I could 'hide' these pdf's into lesson to avoid the 'scroll of death' and 'encourage' my students to see something besides quizzes. I thought if they didn't realize how many pages and links they were looking at, they would be 'tricked' into reading a little more content.
I first tried 'collapsed topics' but it was still 'too obvious' that they needed to read some.
In reply to Cindy Weber

Re: PDF doesn't have scroll bars on apple products.

by Mark Johnson -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers

That is what I was suggesting. The problem you are having is that with the <embed> tag, you are going beyond the realms of standard web content, and telling the browser "use whatever method you have to display this file". In the case of PDFs, different platforms and different browsers will use different ways to do it - some will use pdf.js, others will use an Adobe Reader plugin, others will use their own specific tool, so the behaviour across platforms is not predictable.

Dominique's suggestion of using Adobe's PDF embed API is likely to get you the most consistent result, as it means that you will be using the same method to display the PDF in all cases.

Average of ratings: Useful (1)
In reply to Cindy Weber

Re: PDF doesn't have scroll bars on apple products.

by Joost Elshoff -
Picture of Particularly helpful Moodlers Picture of Testers
Just a thought, but doesn't the mod/resource (File resource) allow PDF files to be embedded in their own browser PDF reader? And doesn't that also work on up-to-date iOS and iPadOS devices? Or is this still something one wouldn't do? Furthermore, why would you want to embed a PDF in a Moodle course using HTML?
In reply to Joost Elshoff

Re: PDF doesn't have scroll bars on apple products.

by Cindy Weber -
moodle list
Yes. I can list pdf files separately and they will work on all devises; but if my students see this list, they will go right to the quizzes. If I restrict the quiz and require that they first click on the pdf files, they will probably call and ask why they can't get into the quiz. I was hoping that if I buried the content in a lesson they would at least need to view the content before trying the quiz. My students were once more ambitious, but now I need to trick them into it.
In reply to Cindy Weber

Re: PDF doesn't have scroll bars on apple products.

by Dominique Bauer -
Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Plugin developers

Adobe has a nice PDF Embed API ➚. Once set up, it is very easy to use.

It allows to embed a PDF viewer for example on a Moodle page. I have not tried it in a lesson, but it should work. 

It works well under Windows. Hopefully it should work with Apple products as well.

In reply to Dominique Bauer

Re: PDF doesn't have scroll bars on apple products.

by Cindy Weber -
Thank you Dominique! I am giving it a try, but I may already be stuck. Did you copy the code into your domain index.shtml file or directly into a moodle extension index file? Changing an index.shtml file is something I want to do correctly.
In reply to Cindy Weber

Re: PDF doesn't have scroll bars on apple products.

by Dominique Bauer -
Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Plugin developers
Cindy,

Follow the instructions given by Adobe. As far as I remember, you have to open a free account, then set a project and give the URL where you want to use the API, i.e. the URL of your Moodle site. Adobe provides an example of the code you have to insert in the HTML of the text field of your Moodle activity (text and media area, lesson, etc.). The code is just for the reader, so of course you have to provide the PDF itself. One easy way is to add the PDF to say a page and set it to "Hidden but available". To get the address of the PDF file, edit it and right click on the name of the file before closing the edit.

It sounds a bit complicated but it's really not, and the reader is quite good. What you get is an Adobe PDF reader directly embedded in your Moodle activity.
In reply to Cindy Weber

Re: PDF doesn't have scroll bars on apple products.

by Lucía Martyn -

Embedding PDFs in HTML can be tricky, especially when it comes to ensuring compatibility across different devices and platforms. Here are some suggestions that might help you:

Consider converting your PDF to a web-friendly format: Instead of embedding a PDF file directly, you might consider converting it to a format that is better suited for web viewing, such as HTML, EPUB, or MOBI. There are many tools available that can help with this, such as Adobe Acrobat or Calibre. By converting your PDF to a web-friendly format, you can ensure that it will be compatible with a wider range of devices and platforms.

Use a PDF viewer plugin: Instead of relying on the default PDF viewer of the user's device, you might consider using a PDF viewer plugin that is designed to work with different devices and platforms. Some popular options include PDF.js, Google Docs Viewer, and PDF Embedder. These plugins can help ensure that your PDF is displayed properly across different devices and platforms.


Test on different devices and platforms: Make sure to test your embedded PDF on a variety of devices and platforms to ensure that it is displayed properly. This can include testing on desktop computers, laptops, tablets, and smartphones, as well as on different web browsers and operating systems. By testing your embedded PDF on different devices and platforms, you can identify any compatibility issues and make necessary adjustments.

Use responsive design: Make sure that your embedded PDF is designed to be responsive, meaning that it can adapt to different screen sizes and orientations. This can help ensure that your PDF is displayed properly on different devices and platforms. You can use CSS media queries to adjust the layout and styling of your embedded PDF based on the screen size and orientation of the user's device.

Provide alternative formats: Finally, consider providing alternative formats for your content, such as HTML or plain text. This can help ensure that your content is accessible to users who may not be able to view your embedded PDF, such as users with screen readers or older devices.

Average of ratings: Useful (2)