Shadowbox Enabled

So I’ve always wanted to enable streaming/playing hd videos in your browser and have been asked if that was possible many times. However, I also wanted to maintain the downloadable aspect of it.

Awhile back, I was played around with Cooliris (previously known as PicLens), however the only video type it supported was Flash. I sent them an email, but they said they were working on it. I believe they still do not support Quicktime movies yet.

I was also playing with Lightbox, but mainly for my photo gallery. It was cool in the fact I can enlarge an image and darken the screen behind it. So while fixing up some random issues on my site today, I decided to see if Lightbox supported video. Unfortunately they don’t:

Can I display flash, video, or other content using the script?

Sorry, photos only. For other content, google for Lightbox modifications or try an alternative script such as Cody Lindley’s ThickBox.

I searched online and found a few that did: Lightview, Lightwindow, mediabox, and Shadowbox.

Lightview looked really nice with the rounded corners, but unfortunately it wasn’t free. If there’s demand to improve to this feature, I might consider switching to it in the future.

Lightwindow did not work in Firefox 3 for some reason. Worked fine in IE7.

mediabox is actually my favorite. It auto-resizes the window to fight the video player snuggly. However, they didn’t have a download package and the installation steps weren’t easy to follow. I was going to invest some time in understanding what I needed to do, but then I found…

Shadowbox works right out of the box and contains simple examples. Unfortunately it doesn’t have the auto-resize thing and seems to stretch the video player to fit the height/width I specify for the frame.

I initially was hitting into the issue where it wouldn’t detect Yahoo’s trailers as Quicktime movies, since they end in .dll. However, I was able to specify player=qt in the rel attribute, and things are working fine now.

With this, I don’t have to modify the existing href to the actual trailer and people can still right click and save the trailer onto their hard drive. What Shadowbox enables is if you’re just browsing and just want to watch some HD trailers in your browser, this has become simple.

If anyone hits into issues, please do let me know.

Turns out I was mistaken about mediabox’s auto-resizing. I finally managed to grab all the files I needed. I’ve uploaded it to zSHARE if you’re interested with playing with it: mediabox Version 0.7.3. It does add a black border around the video player, which I like. I also had to modify the code to set the backcolor attribute for the embed object. Since I didn’t know what the exact dimension of these videos are, it was filling in the extra spacing with a blinding white color. Finally, I added .dll as an extension that should use the Quicktime code path.

Not too sure which one I like more. Going to stick with mediabox for now.