cancel
Showing results for 
Search instead for 
Did you mean: 
deb_maeder
Learner II

iFrame .mp4 AutoPlay Coding

Jump to solution

Our organization is investigating using AWS S3 storage to hold all of our multimedia files and then using iFrames to embed the media file into Canvas pages, assignments, etc.

I have figured out how to do everything except stop the auto play of videos.  I'm stumped.  I'm hoping that someone in the community has experience in HTML (mine is VERY limited) that might be able to provide me with the snippet of code I need to stop the auto play of videos and audio recordings.

Here's what I have so far:

<p><iframe src="https://s3.ca-central-1.amazonaws.com/video.mp4" width="1200" height="600" allowfullscreen="allowfullscreen" webkitallowfullscreen="webkitallowfullscreen" mozallowfullscreen="mozallowfullscreen"></iframe></p>

I appreciate any assistance in advance!


Thanks,

Deb

amazon_s3‌ #code-snippets#code snippet#codes

1 Solution

Accepted Solutions
kenneth_rogers
Surveyor

Hi,  @deb_maeder ‌!

I wanted to reach out and see if you got your autoplay figured out or not. It looks like  @dwahl_sales ‌ give you a suggestion about changing how you embedded the videos, so for now I am going to mark this as "Assumed Answered". This won't prevent other folks from commenting on this question though in the event other ideas come up!

Let us know how things are going!

View solution in original post

4 Replies
dwahl_sales
Instructure
Instructure

Hello  @deb_maeder ‌,

If you really are just directly linking to the raw .mp4 file and not an HTML page or object which contains both a player and the media, then it would probably be better to simply use the HTML <video> element which is on the whitelist of approved HTML elements ( https://s3.amazonaws.com/tr-learncanvas/docs/Canvas_HTML_Whitelist.pdf )

Using the <video> element will allow you to leverage the different parameters such as "autoplay" and whether or not to display controls, etc.

<video width="1200" height="600" controls>
  <source src="https://s3.ca-central-1.amazonaws.com/video.mp4" type="video/mp4">
  <p>Your browser does not support the video tag. Please click the following link to download the video.</p>
  <p><a href="https://s3.ca-central-1.amazonaws.com/video.mp4">video.mp4 download</a></p>
</video>‍‍‍‍‍‍

Oh, and don't forget that the <video> element allows for <track> element to be added so you can have proper subtitles. Accessibility is important :smileygrin:. Of course all this content management could get unweildy, and I'd be remiss if I didn't mention Arc.

kenneth_rogers
Surveyor

Hi,  @deb_maeder ‌!

I wanted to reach out and see if you got your autoplay figured out or not. It looks like  @dwahl_sales ‌ give you a suggestion about changing how you embedded the videos, so for now I am going to mark this as "Assumed Answered". This won't prevent other folks from commenting on this question though in the event other ideas come up!

Let us know how things are going!

View solution in original post

Danny Wahl’s response did not work for our needs. I ended up finding the following HTML5 code which worked:

www.bryanhealthcollege.edu

Thanks for letting us know, Deb. Unfortunately your code didn't come through. When you get a chance we'd all love to see what worked!