"Different" Parallax scrolling effect

Question

I work in my new portfolio, and I want to make such an effect on the site:

The effect of the iPhone and parts that appear on the sides when scrolling. This is a kind of parallax scrolling.

I tried to search but cannot find. So I “stole” the code, which saves the page and adapt the code, but it seems to have a lot of unnecessary things.

Does anyone know how I can do this?

+3

Daniel May 07 '12 at 17:48

3 answers

Sinetheta · Answer 1 · 2012-05-07T17:55:32+0000

Parallax: the apparent displacement of the observed object due to a change in the position of the observer.

Parallax is one specific scrolling effect that simulates depth with relative scrolling, for example .

Parth Thakkar · Answer 2 · 2012-05-07T18:14:52+0000

, , . , / . , - . , ( , ). .

"", - "". :

D = > A k = > a > 1 ( )
y = > (document.body.scrollTop)
dy = > A, C
dx = > . A C
theta = > ( ) A, C

C A, - ( - ). , y , D . , D /, . , /, D . dy, dx , css C ( ). , dy, dx, .

dy = Math.sin(theta) * D
dx = Math.cos(theta) * D

, . , , - ... , ...:)

undefined · Answer 3 · 2012-05-07T17:56:08+0000

basically it uses the event scroll, and then at certain points it animates the fields.