Параллакс со слоями CSS ⇐ CSS

[Anonymous]

Мне нужно, чтобы часть моей домашней страницы выглядела «многоуровневой». Что-то вроде этого ниже
http://webdesigntutsplus.s3.amazonaws.c ... index.html
Специально из Slide С 3 по слайд 4, элементы отображаются снизу вверх.
Я попробовал это

Код: Выделить всё

Scroll down!

 Content here 

 Content here 

 Content here 

 Content here 

body{margin:0;}
#main {height: 700px; position:relative; z-index: 2; background: blue;}
#revealed-section {height: 400px; position:fixed; bottom:0; width:100%; background: green;}
#revealed-section-placeholder {height: 400px;}

http://jsfiddle.net/qYbs7/1/
Но моя проблема в том, что это работает, если это полное решение страницы, но однажды Я хочу, чтобы это было компонентом на моей странице React, это не работает. Нижняя часть: 0, например, находится в самом низу моей домашней страницы и не содержится в блоке div.
Может быть, я что-то упускаю из виду, но было бы очень полезно, если бы кто-то более опытный в идеале можно было бы превратить этот код в компонент реакции копирования и вставки с попутным ветром.

Подробнее здесь: https://stackoverflow.com/questions/782 ... css-layers