FORUMS: list search recent posts

How does apple.com have custom controls etc... Quicktime

COW Forums : Web Design

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
Bengt JonssonHow does apple.com have custom controls etc... Quicktime
by on Feb 23, 2011 at 5:34:07 pm

Not sure if this is the right forum. Apologies in advance.

Please look at this page: http://www.apple.com/macbookair/#macbook-air-video

A few questions:

1. As you drag the cursor over the video, how do they implement this controller?
2. On the right of the controller, there is a button that looks like a monitor that allows you to choose 3 different resolutions. How can the lay user use this capabilility on their own site? Does a video have to be encoded for all 3 resolutions, or just the highest and then something is scaling it down on the fly?
3. To the right of the resolution button , there is a full screen button. How is this done?

Basically I want the same thing that apple.com is using. I feel like I've searched eveywhere, and not really found a definitive answer.

Also, Is this movie downloading or streaming?

Any help or direction is appreciated.


Return to posts index

Curtis ThompsonRe: How does apple.com have custom controls etc... Quicktime
by on Feb 23, 2011 at 6:08:12 pm

hello...

short answer is it's their own custom-created skin over a mp4 video...so basically html5 video in most cases...

html5 video is a complex thing that is beyond explanation here in a simple post. your best bet is to google it and learn, or here is a good starting point:

http://camendesign.com/code/video_for_everybody

in html5 video, you can ultimately use css to customize a skin (what you see them doing over the video) - here's an open-source tool that you can use to do that:

http://videojs.com/

but again - the apple one is a custom implementation, but certainly something you could replicate...

hope that helps!

sitruc


Return to posts index

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
© 2017 CreativeCOW.net All Rights Reserved
[TOP]