I have a custom page that I have written using Bootstrap JS. That page loads inside an iFrame inside Canvas. Like so:
<div id="kl_custom_css"> </div>
<p><iframe id="i_frameheight" style="border: none; overflow: hidden;" src="https://student.emeritus.org/courses/187/files/107231/download" width="100%" height="1800" data-api-endpoint="https://student.emeritus.org/api/v1/courses/187/files/107231" data-api-returntype="File"></iframe></p>
Inside the page "https://student.emeritus.org/courses/187/files/107231/download", there are several images that are referenced either by relative URLs or absolute URLs. Like so, below:
The problem is that on the iOS version of the canvas app does not display any of these images. The images display successfully on the Android Canvas app, on the Google Chrome browser on Android, on the Safari browser on the iPhone and on the desktop browsers.
But the images don't show up in the Canvas app on the iPhone 6, 7, 8 and X.
Can anyone help shed some light on this or help with this?
Thanks in advance.