Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

buymeaniphone

macrumors 6502
Original poster
Feb 8, 2007
303
0
San Antonio, Texas
quicktime%20screenshot.png

I'm trying to create a similar affect as what Apple uses on their Quicktime trailer pages. When you click on the link to view a movie trailer in a specific size, the screen fades to grey and a window animates to the center of the screen and begins to play the movie trailer. You can see what I'm describing in the screen shot above. I have a feeling this was created with Scriptaculous but I can't find the same affect on their website. Please help me figure out eithe what Apple is using or how I can achieve a similar affect.
 
Ugh, I wish websites would stop using scripts like that. They completely reduce the usability of a site.

Could you elaborate? Just curious what aspects you find lessen the usability. I don't necessarily disagree.

Edit: As for what Apple is doing there: I gleaned the code and it looks like there are several dependencies to get the whole effect. They include Prototype, Scriptaculous, Trailer, Trailer_Generic as the main ones and quite likely some of their other JavaScript files. They have some comments in some of their code, but it would take some time to understand how to use all that code for your own site. You'd be better off finding a tutorial for something like this.
 
Please don't turn this thread into an argument or debate over the usability of this script, I just need someone to point me in the right direction as to how I can recreate it.

Yeah I noticed the Scriptaculous string in there, I've been starring at the code for about 2 hours now and haven't quite made any sense of it. I should probably try to find a similar affect on a smaller site since Apple probably has a whole server dedicated to running scripts like this.
 
Could you elaborate? Just curious what aspects you find lessen the usability. I don't necessarily disagree.

Basically the fact that you can't scroll in the window any more and that it dims the background. Just because I go to watch a video does not mean I necessarily want to see it. Quite often I just listen to the audio while I read the text on the site. Scripts like that ruin that ability.

Plus it is just eye candy for eye candies sake. Something which I am against.
 
Yeah I noticed the Scriptaculous string in there, I've been starring at the code for about 2 hours now and haven't quite made any sense of it. I should probably try to find a similar affect on a smaller site since Apple probably has a whole server dedicated to running scripts like this.

Some things to look at to get you started:
Thickbox
Lightview
The Lightbox Clones Matrix

@Cromulent: I can understand that point of view. The darkened background does aid some aspects of usability by creating a focus (so it's not just eye candy), but it does miss that some people have a different focus desire, as you state. The disabling of scrolling goes in hand with the before mentioned aid of focus. I have my own script for doing the lightbox-style effects for my image gallery. There's no audio for people to listen to as they scroll down in my case, but the idea to give the user at least some option of how they interact with the images could be a nice idea. Something I'll have to give some thought to. Apple as well could provide such preferences to visitors.
 
Thanks Angelwatt, I'm actually on Thickbox right now, but I'll check out Lightview and lightbox. One thing I can't figure out with Thickbox is if it will allow me to embed a video in the window, it only shows examples with static images.
 
Thanks Angelwatt, I'm actually on Thickbox right now, but I'll check out Lightview and lightbox. One thing I can't figure out with Thickbox is if it will allow me to embed a video in the window, it only shows examples with static images.

I don't really ever deal with video, but looking at the examples I'd probably try out the inline content example, but it partly depends on how you have your page setup.
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.