View Full Version : Netflix roll-overs with movie details... how?

31 Jan 2012, 05:42 PM
What's the underlying code that Netflix uses to pull off automatically spawning a movie details pop-up when users mouse over a movie poster on their site?

I am putting together a site-wide help system on my website and I'd like to be able to insert 'help' icons such as http://dl.dropbox.com/u/54787/icon5.png where needed, which when hovered over would spawn a similar netflix-style movie details window with relevant help information. NOTE: Just as Netflix has figured out a way to do in their movie-details window, I'd very much like to be able to include clickable links in the pop-up window

Any suggestions or links to where I can learn more would be sincerely appreciated! Thanks!

02 Feb 2012, 07:36 PM
I haven't even looked at Netflix. They are a sore spot for me and I have to say that they've really screwed their site up on numerous occasions. The management of NF even asked for free help from the webdev public community at one time in a blog. They insinuated that they just didn't have the resources to improve their site like they would like to, and they actually, in so many words, asked thier customer base to help them by coding improvements and apps.

I would imagine they use some convoluted jquery/dbase system. There's an easier way.

Here's where to start:


If you have variables that will dictate what information and links you need to have in your hoverpopups, you'll need a dbase and you'll need to incorporate a query and some PHP script to populate your hoverpopups with the correct information. Being that your example was basically a need for "help balloons", if it's not all that complicated and you don't have a bunch of variables that dictate exactly what info you need to appear in the hoverpopups, you can use includes within the span. Many thanks to Wickham. I've done some amazing things with these hoverpopups. If you have them "touching" the "original" div, you'll have (cursor) connectivity and you'll be able to have appropriate links in the hoverpopups (the spans). Since they no JS is involved, they are SEO, engine, and bot friendly.