Another great tutorial from Codyhouse.A list of split blocks that reunite on scrolling, simulating a movement along the z-axis with the help of CSS transformations and jQuery.
The 2-blocks design approach is quite common nowadays. On one side the text paragraph, on the other a visual element. With this nugget Codyhouse tried to “spice-up” the transition between the sections by simulating a movement along the z-axis while the user is scrolling (or using the 2 navigation buttons).
No CSS 3D property though, just the Scale and Translate transformations, controlled through jQuery.
Use your mouse wheel.
[gpp_button color=”blue” url=”http://0bf196087c14ed19d1f11cf1.ambercreativelab.netdna-cdn.com/demo/3d-curtain-template/index.html” title=”3D Curtain Template” icon_left=”external” target=”_blank” size=”medium” display=”inline”]Demo[/gpp_button] [gpp_button color=”blue” url=”http://codyhouse.co/gem/3d-curtain-template/” title=”3D Curtain Template” icon_left=”cloud-download” target=”_blank” size=”medium” display=”inline”]Download[/gpp_button]
