Saturday, 31 May 2014

Embedding Videos

There are several videos in my iBook so I want to ensure that they're on my website too.

Initially, I tried to embed the videos into my site using the i-frame embed code that is supplied by YouTube. I followed this tutorial:


The problem that I had, though, was that it did not allow the videos to be Responsive. From here I decided to download the video so I had the physical file, place it into a "videos' folder in my source files and then use the <embed> tags in my code. By doing this I could then tag the embedded video to display at 100% and then place it within the skeleton framework, and I also had the ability to make a lot more adjustments than what I could with just the i-frame code. 

Example code of one of my embedded videos:

<div class="twelve columns video">
<video width="100%" controls> <source src="video/Geography_Lesson_ What_is_a_Volcano.mp4" type="video/mp4">
</video>
</div>

No comments:

Post a Comment