24 Superb Sites That Use Horizontal, Vertical Or Multi-Directional jQuery Scrolling Effect

24 Superb Sites That Use Horizontal, Vertical Or Multi-Directional jQuery Scrolling Effect

jQuery JavaScript Framework has fast become an indispensable part of web 2.0 formation and will continue to be used heavily in websites and projects. As the search for entertaining visual effects continues, the performance and speed of a site should not be compromised. Now with jQuery, it’s possible to integrate captivating visual effects together with highly effective functions.

Using jQuery scrolling effect is not only a new form of showcasing your site or work, but it also gives the audience a fresh experience when they interact with your site.

Horizontal, Vertical Multi Direction jQuery Scrolling Effect

With the help of jQuery.ScrollTo plugin, we can transform a normal site into a slideshow storyboard that will bring across a unique experience to visitors during their journey on the site.

Here are 24 superb sites that has used jQuery to displayed either the horizontal, vertical or multi-directional scrolling effect. Most of them have used the jQuery.ScrollTo plugin to create a flash-like scrolling navigation experience, while some of them have used other unique jQuery scripts.

jQuery Horizontal Scroll

jQuery Horizontal Scroll is a unique way of presenting your site to the audience, not many sites have chosen to use it in their site. Sometimes designers or developers worry that the audience will not like the feel horizontal scrolls give, and believes it may compromise the conventional style of vertical web page surfing.

When applying the horizontal scroll on a site, the message that you want to bring across needs to be bold so that it will create an impact to the audience. Also, remember to keep the writing to a minimum. If it’s done appropriately, they can be very attractive.

Vanityclaire
Claire Baxter lives in Dallas and is a Creative Director of the Art Director persuasion.

Vanityclaire
Vanityclaire

Aredes for Girls
AREDES is a Brazilian company dealing with a variety of clothing for girls.

Aredes for Girls
Aredes for Girls

Carrot Creative
Carrot Creative is a new-media marketing agency located in DUMBO, Brooklyn, NY. It specializes in social media marketing and user experience design.

Carrot Creative
Carrot Creative

Sursly
Tyler Finck is a designer that specializes in Photoshop, Illustrator, InDesign, Flash, Canon/Nikon DSLRs, Final Cut Studio, Logic Pro, Mac + PC and iWork.

Sursly
Sursly

Peter Pearson
Peter Pearson is a BA New Media graduate from the University of Leeds, UK, currently based in St Albans, Hertfordshire. The site is a showcase of his university and freelance work as a web designer, developer, animator and artist.

Peter Pearson
Peter Pearson

Zupadupa
Zupadupa is a web agency from Romania that offer web design services, web development, marketing and online ads, web consulting, branding and rebranding.

Zupadupa
Zupadupa

Gavin Castleton
Gavin Castleton is a musician and currently on tour to spread his talents.

Gavin Castleton
Gavincastleton

Artist In Design
Artist In Design is a German web agency that provides web graphic designs.

Artist In Design
Artist In Design

jQuery Vertical Scroll

jQuery Vertical Scroll reassembles the old school way of vertical scrolling and injects a new vibrant auto scrolling into it. By clicking at the navigation, the page scrolls gracefully down the section. Now you can change your perspective of the traditional vertical scrolling sites.

Danny Blackman
Danny Blackman is currently a 3rd year BA Communications & New Media student at University of Leeds, UK and a freelance designer & developer.

Danny B lackman
Danny Blackman

Design in Social
Designinsocial is a collective aspiration, where one occurs to the opportunity to entrepreneurs and industrialists with fewer resources to harness his product or business through professional graphical design.

Design in Social
Design in Social

Dreamerlines
Janis is a web designer working for a digital creative agency called Digibrand.

Dreamerlines
Dreamerlines

Emrah Yaman
Emrah Yaman’s was born in Kocaeli/Turkey and is a freelancer working on all kinds of projects varying from websites to print and brand identity.

Emrah Yaman
Emrah Yaman

Kinetic Shadows
Et Cetera Brian started his design career in multimedia and web design in the 90s and deals with interactive development, 3D work and interactive design.

Kinetic Shadows
Kinetic Shadows

Legwork Studio
Legwork Studio is a web agency that deals with print design, web design & development and motion design.

Legwork Studio
Legwork Studio

New in Creative
Nguyen Le is an Interactive Designer/Developer from Melbourne.

New in Creative
New in Creative

Pojeta
Tomas Pojeta is a designer from the Czech Republic.

Pojeta
Pojeta

Red Crown Studio
Red Crown Studio has a team of professionals that deal with web design, web development, visual identity design and email marketing.

Red Crown Studio
Red Crown Studio

Spicy Design
Alex ElChehimi is a web/graphic designer located in Montreal.

Spicy Design
Spicy Design

Toby Powell
Toby Powell is a web designer that specializes in creating beautiful, usable, professional websites using best practice accessibility and the latest W3C web standards guidelines.

Toby Powell
Toby Powell

Visual Elixir
Jim Gunardson is an illustrator and designer located in New Jersey, near Philadelphia.

Visual Elixir
Visual Elixir

jQuery Multi-Directional Scroll

Integrating the best of horizontal and vertical scrolling effects and transforms them into an interactive experience. Using jQuery multi-directional scroll effect is a beautiful way of presenting your site to your audience.

Wall Swaps
Wall Swaps is a design firm located in Nottingham, UK.

Wall Swaps
Wall Swaps

Serial Cut
Serial Cut is a Madrid based studio, established in 1999 by Sergio del Puerto, working on a wide variety of worldwide projects, but focusing mainly on Art Direction.

Serial Cut
Serial Cut

Enterro da gata
Enterro da gata is developed by Rui Silva, also known as “Penso”, who lives in Braga, Portugal. He is a web designer and developer.

Enterro da gata
Enterro da gata

J and K
Jackson & Kent is a French agency that deals with web designs and development.

J and K
J and K

Conclusion

This list sums up some of the superb sites that have used jQuery to display horizontal, vertical or multi direction effects. Most sites are so dynamic that even the background moves around. One thing is for sure, jQuery will be constantly improving and we will be constantly looking for better ways to present our sites to our audiences.

Do you use the above mentioned jQuery scrolling effects in your site(s)? Or do you have a superb site that you wish to recommend? Leave your recommendation below!

Comments

  1. / Reply

    Great post!!
    Thanks for sharing.

  2. / Reply

    Great post! Here are 2 websites that must be part of this collections: http://www.visualboxsite.com & http://www.lucino-gene.com

      • Terrance,
      • June 29, 2009
      / Reply

      Thanks for the recommendation!

  3. / Reply

    I’d like to throw in http://tyrale.com for consideration.

      • Terrance,
      • July 1, 2009
      / Reply

      Hi Tyrale,

      How can i miss you out?

      Part 2 is on it’s way, your site will be added to the list.

      Stay tuned. :)

    • Alan,
    • July 10, 2009
    / Reply

    Does anyone know of any tutorials going through the process of creating vertical scrolling website.

    • franzyfranz,
    • July 11, 2009
    / Reply

    sweet collaction
    i really like this one: http://design-farm.net

  4. / Reply

    Thanks for including Kinetic Shadows in this great list.

    • Donna,
    • October 26, 2009
    / Reply

    Maybe you should consider adding http://www.salon-lafolie.com to your list. Its using not only scrolling effect, but awesome illustrations too.

    • Jay M,
    • November 13, 2009
    / Reply

    Those are some great skills :)

  5. / Reply

    Süper çalışma saygılar.

  6. / Reply

    Gerçekten emeğe saygı göstermek lazım:)

  7. / Reply

    Terrance can u plz try and check if my website can be added?

    http://www.tridibghosh.com

    It has both use of lightbox and Jquery scrolling. Hope you like it.

    Thanks

  8. / Reply

    I’m thinking of using this effect on a website I’m currently designing so these are really handy examples.

    Cheers for the post

    Ryan

    • fab,
    • December 30, 2009
    / Reply

    Great post!

    I love this designs! They demonstrate that in many cases Flash is superfluous..

    Here 2 website with the same effects but build in mootools…

    http://www.emergentitaliani.it

    http://www.solegiallo.it

    and this are 2 horizontal scrolling portfolio templates for indexhibit and wordpress using jquery:

    http://www.stefanoferroni.com

    http://www.marconofri.com

    Bye!

    • Deb,
    • January 9, 2010
    / Reply

    Nice Collection! I just finished working on my own horizontal website. http://www.deboraparentes.com
    Check it out!

  9. / Reply

    very nice javascript site list

    • Mia,
    • April 14, 2010
    / Reply

    Superb ! :D I love horizontally scrollable sites ( even if most users dont prefer them ) – as long as its kept to a minimum & done nicely as stated . Great roundup of some truly awesome sites ! :)

    M.

  10. / Reply

    good stuff, really help full

  11. / Reply

    good collection, it was nice to read, enjoyed

  12. / Reply

    Hi all, check this one out. http://www.taylortaylorlondon.com

  13. / Reply

    i liked this comments

    • Adhi,
    • October 9, 2010
    / Reply

    Nice useful article keep posting like this.. Thanks for sharing this info.
    My Blog

  14. / Reply

    please see this one

    http://www.taylortaylorlondon.com

  15. / Reply

    Check my site too its vertical scroller .

  16. / Reply

    I’ve just put online my new website. Vertical-scrolling navigation with jquery
    http://www.stefanoginella.com
    let me know what you think about it! ;)

    Ste.

    • Michal,
    • February 15, 2011
    / Reply

    Hi guys, does enybody know where to find a good tutorial for website like these?

    Thanks.
    M.

    • Bobby,
    • May 3, 2011
    / Reply

    You should definitely check out http://www.stopzombieitis.com. Awesome use of vertical scrolling to create an old-film effect.

    • J,
    • June 22, 2011
    / Reply

    Nice site: http://www.balerom.net

  17. / Reply

    thank you for your recommendation.. very cool

    • leena,
    • September 21, 2011
    / Reply

    Thanks for sharing this .. its very useful t us …

    • Merry,
    • January 21, 2013
    / Reply

    Nice Posts, thaks for the updates. jQuery is easy to write manually, I never used plugins to write jQuery but after visiting this blog, I saved my time to type language, I appreciate the admin. :)

Leave a Reply

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

Deals