20 incredible examples of smooth horizontal and vertical sliding navigation websites

There is an effect that I especially love on the websites, I don’t know if you have ever seen this effect often used for portfolios or photographic galleries, I can name it a smooth sliding navigation.

This concept is to put a lot of content, generally a bio, references lists, services, and a contact form on a same page but separated by a large space. The result is a very very long page … not really easy to browse it, but you can switch the steps with a menu and with a sliding animation.

The must on these websites:

  • You can load the website just one time and you can browse it really fast after its upload
  • You can separate the different parts of the page with different universes
  • You can create a really KISS website (easier using and reading)

Ok it’s my mind, I find this effect really cool, and my future website (my portfolio) will use this sliding effect!

To persuade you I done a really good selection of 20 different websites using this sliding navigation, I cheer you to visit each of them, because they are really impressive! And finally, if you are sure to dislike this effect let me know your thinking in the comment: Why you dislike?

Example:

And look at this example with a little explanation:

Showcase:

I selected 20 websites using this effect, look at this showcase now.

tympanus


http://tympanus.net/

Soft Facade


http://www.softfacade.com/

Charles Elena


http://www.charleselena.com.au/

Plastic Beach Watch


http://www.plasticbeachwatch.com/

Creative Switch


http://www.creativeswitch.net/

Ajax Masters


http://www.ajaxmasters.com/

Zuls Design


http://www.zulsdesign.com/

Agigen


http://agigen.se/

UD+M


http://www.uberdm.com/

Tyrale


http://tyrale.com/

Bobwal


http://bobwal.com/

Rotciv


http://www.rotciv.com.br/

My name is Orman


http://www.ormanclark.com/

F5


http://ffive.com.au/

Eduardo de La Roque


http://www.delarocque.com.br/09/home.html

two 24 STUDIOS


http://two24studios.com/

Mateusz Pasternak


http://www.pasti.pl/

Vanity Claire


http://vanityclaire.com/

Fridge Works


http://www.fridgeworks.com/

X Graphica


http://xgraphica.com/

So thank you very much to you to read and to see my showvase, if you enjoyed this post, and this blog please follow us up on RSS or Twitter See you later by another 2expertsdesign.com tutorial!