JINVERTSCROLL, comme son nom l’indique bien est un plugin Jquery pour inverser le sens de défilement de votre site internet et ainsi obtenir un scroll horizontale.

 

jInvertScroll le plugin Jquery pour site horizontale

 

Comme expliqué ci-dessus, Jinvert Scroll est un script Jquery qui vous permet donc d’avoir un site “ ONE PAGE ” non pas vertical mais à l’horizontale. Le script nous est proposé par Pixxel Factory. La grande tendance de l’année 2013 était bien évidement les site dit ” ONE PAGE “, cette tendance continue également cette année, mais certains dont Myspace on repensé cette navigation à l’image de ce que nous propose JInvert Scroll.

 

L’avantage qu’apporte JInvert Scroll est notamment le parallax du background. Ce parallax apporte un vrai plus en terme de dynamise pour l’utilisateur. L’expérience est d’autant plus intéressante sur un mobile, mais aurais pu être améliorée. Bien sûr, vous pouvez y ajouter tout type de contenu, vidéo, image, etc. Il vous est également possible de modifier votre site simplement grâce à quelques options:

$.jInvertScroll(['.myScrollableElements'], {
width: 'auto', // Page width (auto or int value)
height: 'auto', // Page height (the shorter, the faster the scroll)
onScroll: function(percent) {
// Callback function that will be called each time the user
// scrolls up or down, useful for animating other parts
// on the page depending on how far the user has scrolled down
// values go from 0.0 to 1.0 (with 4 decimals precision)
}
});

 

Ce module est à tester par curiosité ou bien tout simplement pour se démarquer des autres personnes pour un portfolio ou bien un support de présentation de projets.

 

jInvertScroll le plugin Jquery pour site horizontale

 

jInvertScroll le plugin Jquery pour site horizontale

 

jInvertScroll le plugin Jquery pour site horizontale

 

Le site

Leave a Comment

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>