Slidorion – Plugin jQuery – Un Slider couplé à un menu accordéon et bien plus !
Vous cherchez un slider en javascript ? Mieux, en jQuery ? De plus, couplé à un menu accordéon avec du contenu afin de rendre l’utile à l’agréable ? Slidorion est le plugin qu’il vous faut. En effet, vous allez pouvoir faire défiler des images (avec textes, html etc… ou non) avec un menu associé et son bloc de contenu. Autant dire que ce plugin jQuery est intéressant pour agrémenter un page web.
Comment utiliser ce plugin jQuery :
Importer les librairies dans le document (dans le « head » – css+js) :
[pastacode lang= »markup » manual= »%3Clink%20rel%3D%22stylesheet%22%20href%3D%22css%2Fslidorion.css%22%3E%0A%3Cscript%20src%3D%22https%3A%2F%2Fajax.googleapis.com%2Fajax%2Flibs%2Fjquery%2F1.7.1%2Fjquery.min.js%22%3E%3C%2Fscript%3E%0A%3Cscript%20src%3D%22js%2Fjquery.easing.js%22%3E%3C%2Fscript%3E%0A%3Cscript%20src%3D%22js%2Fjquery.slidorion.min.js%22%3E%3C%2Fscript%3E » message= » » highlight= » » provider= »manual »/]
Vous l’aurez compris, easing est nécessaire au bon fonctionnement de Slidorion.
Télécharger Easing
Construire la structure qui deviendra notre Slider à menu :
[pastacode lang= »markup » manual= »%3Cdiv%20id%3D%22slidorion%22%3E%0A%3Cdiv%20id%3D%22slider%22%3E%3C%2Fdiv%3E%0A%3Cdiv%20id%3D%22accordion%22%3E%0A%3Cdiv%20class%3D%22link-header%22%3ENew%20Features%3C%2Fdiv%3E%0A%3Cdiv%20class%3D%22link-content%22%3E%3C!–%20content%20–%3E%3C%2Fdiv%3E%0A%3Cdiv%20class%3D%22link-header%22%3EA%20Simple%20Image%3C%2Fdiv%3E%0A%3Cdiv%20class%3D%22link-content%22%3E%3C!–%20content%20–%3E%3C%2Fdiv%3E%0A%3Cdiv%20class%3D%22link-header%22%3EBackground%20Image%20w%2F%20HTML%3C%2Fdiv%3E%0A%3Cdiv%20class%3D%22link-content%22%3E%3C!–%20content%20–%3E%3C%2Fdiv%3E%0A%3C%2Fdiv%3E%0A%3C%2Fdiv%3E » message= » » highlight= » » provider= »manual »/]
Et l’initiation basique du plugin :
[pastacode lang= »javascript » manual= »%24(document).ready(function()%7B%0A%24(‘%23slidorion’).slidorion()%3B%0A%7D)%3B » message= » » highlight= » » provider= »manual »/]
Bien entendu, il existe de multiples options, comme la vitesse de changement, des effets tels que les fondus, les intervalles etc…
Vous pouvez directement télécharger le plugin Slidorion.
Vous avez des démonstrations complètes sur le site du plugin jQuery Slidorion.
Un bon petit plugin jQuery bien pratique.
Et vous qu’en pensez vous ?
Articles qui peuvent vous intéresser :
- s3Slider – Plugin jQuery – Un slider simple pour vos sites web
- jCoverflip – Plugin jQuery – Le Coverflow simple et efficace
- GMap3 – Plugin jQuery pour API Google Maps 3ème version
- jQuery AutoSuggest Plugin – Boite de texte avec suggestions Ajax
- jQuery Slick Plugin – Agrémentez vos sites d’onglets rétractables
Trackbacks/Pingbacks