asked on

scrolling background images

If you go to the following link here

http://www.thedailybeast.com/newsweek/2013/06/26/rick-rubin-on-crashing-kanye-s-album-in-15-days.html

keep scrolling down you will see multiple background images for each article how do they do that effect

Scott Fell

Each div of content contains a <figure> tag with the image. http://www.w3schools.com/tags/tag_figure.asp

stargateatlantis

ASKER

is that how you get that static scrolling effect

Tom Beck

Seems like you could just use a background div with position:static, load text into other divs stacked vertically on the page with more divs in between that have background:transparent. The transparent divs would act like windows through the text content to reveal the static background images. Then with javascript/jquery monitor scroll position and swap out the source of the background image on the static div so a new picture appears through the windows when scrolling past a predetermined points in the height of the page.

Shame it does not work on that site in Chrome v27. At least not on a Mac. The images are just fixed. Works in Firefox though. Nice effect!

Scott Fell

It works on my mac chrome Version 27.0.1453.116 as well as firefox.

Tom Beck

I have the same version of Chrome. The images are fixed on the page. I looked through the plugins and none are disabled. Weird.

ASKER CERTIFIED SOLUTION

Gary

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial