Vertical Parallax – A new trend in webdesign

vertical-parallax-webdesign

Parallax based webdesign was already a trend for the past few years, but it looks like vertical parallax is going to be the next big thing. Unlike the typical horizontal parallax, the movement happens as you scroll the page. The following is a list of creative websites that has marked the beginning of this trend. I’m expecting to see more of this in 2011.

Vertillax a premium vertical parallax based wordpress theme. Create your own parallax website in minutes!
parallax_wordpress_theme

Ben the bodyguard This is almost like watching a short film ;)
vertical parallax effect

Nike better world You’d be already familiar with this.
Nike parallax webdesign

TEDx Portland A unique use of the parallax effect.TEDx vertical parallax

ResolutionIM Don’t take your eyes off the rocket as you scroll.
Rocket Parallax

David Beckham

Manufacturedessai

APO
vertical scroll

Tutorial to create a vertical parallax using CSS and jQuery

And finally, an awesome detailed tutorial explaining how to create a vertical parallax using jQuery and CSS.
Vertical parallax using jQuery and CSS

About Gopal Raju

Gopal Raju is a passionate designer, developer and blogger from India. He’s the founder of Convax Solutions, a web design and development agency in India. Catch up with him on dribbble, Twitter and Facebook.

16 Responses to Vertical Parallax – A new trend in webdesign

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

  1. parallax based web design really biggest things.very informative and useful side its.thanks a lot

  2. Jon Raasch created a great jQuery plugin to enable vertical parallax scrolling: http://jonraasch.com/blog/scrolling-parallax-jquery-plugin. Also here is a great example of a site using his plugin for a gorgeous effect. http://www.funsies.com

  3. Hello colleagues,

    Beautiful website and beautiful pictures

    Good luck, it is a professional website.

    Greetings from Belgium

  4. Wow!
    These are nice examples of vertical scrolling…
    Thanks for sharing :)

  5. These are some interesting trends. Thank you!

  6. Ben the Bodyguard is nominated in two categories at the webbys awards this year, to me its worth to give a vote.
    http://goo.gl/yHbqf

  7. hey friends, thanks for featuring our tutorial :) feel free to link to our other tuts :)

  8. I don’t think Parallax is the right name for this

  9. I guess people like to scroll these days. I especially like APO’s website design. Although it’s not that simple to understand I think it’s pretty fun to browse the website. Let’s see if this vertical trend continues… ;-)

  10. Love this effect, check this demo out too

    http://www.davidbeckham7.co.uk