PDA

View Full Version : Embedding multiple video formats. Can it be done?


sweetpea11
07-22-2011, 04:34 PM
Hi. This may be a little long winded, but I want to make sure you know what I'm trying to achieve.

I created a animation using Cinema4D. Rendered it out in Quicktime, & saved for web - this gave me a folder containing 2 M4V, (one labeled computer, one labed iPhone) 3GP, and MOV format files. Of course, IE can play none of those, so I created a SWF version also.

So what I want to know is - is there a way to have a single link go to all those files at once? So the guy on his iPhone sees the right file & the guy on a Mac sees the .mov & the guy running IE sees the .swf?

Oh, and I'm a designer not a programmer. I know some code, but I'm not very proficient so I'm sorry, but please be as descriptive as possible. :( I hate to throw in that last bit but it should prevent me from asking "annoying" questions later.

If you need to see the videos, they are here (http://www.hitecsolar.com/mounts.html) here (http://www.hitecsolar.com/flexiblejoints.html) and here (http://www.hitecsolar.com/anchors.html)

gentleone
07-22-2011, 10:48 PM
It is possible with some JavaScript and the HTML5 <video> tag. I know you said you're no coder, but the documentation is good and there are examples on their website. Of course you need to use the HTML5 doctype on your page in order to work with this.

The link: http://mediaelementjs.com/

Ricky55
07-23-2011, 05:31 PM
Yes of course this is possible as Gentle says and its good that you are considering users of other devices. Its actually very easy to do too with HTML5.

My preferred method of doing this is using Flash video as the primary source as this offers more flexibility than HTML5 then go to HTML5 when Flash is not available such as on the iPhone.

This is a great video tutorial to show you how to do this.

To use this method you need your video in MP4 and OGG you can use an open source app such as handbrake to get your files.

The tutorial
http://www.gotoandlearn.com/play.php?id=128

Handbrake
http://handbrake.fr/

Firefogg (used to create the OGG files) Firefox extension.
http://firefogg.org/

Ricky55
07-23-2011, 05:33 PM
Another great resource

http://camendesign.com/code/video_for_everybody

But if you follow that tutorial mentioned in my first post you'll be fine.

sweetpea11
07-25-2011, 08:02 PM
Thank you. The tut from VfE looks like I don't need secondary code at all, just the multiple source codes...

Quick question/clarification: Both tutorials say to list the mp4 first. Like I said, I have a computer version and an iPhone version. If I just link the one, the code will know what to do? The VfE page says it will - but I'm looking for clarification from someone that it actually will before I mess with my code. You know what I mean?