Archives des tags : Slideshow

Pas encore de description pour le tag Slideshow. Suggérez à l'administrateur du site de d'y remédier.

390 ressources Javascript & jQuery

Cette liste de liens pour le développeur web front-end et l’intégrateur HTML & CSS est issue de la veille documentée que j’effectue depuis deux ans sur le blog Javascript & Webdesign. Elle reprend les 139 ressources Javascript et jQuery déjà publiées sur ce site, auxquelles j’ai ajouté les 78 nouveaux liens publiés depuis, ainsi que 73 tutoriels pour créer des diaporamas et autres Slideshows. Last but not least, vous pourrez accéder à une dernière liste composée d’une bonne centaine de bibliothèques Javascript (Polyfills) pour émuler HTML5 dans les navigateurs qui ne prennent pas les nouvelles API’s en charge. A quelques exceptions près, les  liens pointent directement sur les sources d’origine.

Elastislide : un carousel jQuery réactif (Responsive Webdesign)

Le webdesign réactif (traduction approximative de Responsive Webdesign) est un ensemble de techniques permettant d’adapter la mise en page d’un site web selon le périphérique de l’utilisateur. Avec l’arrivée des Media Queries en CSS3, le webdesign réactif devient de plus en plus utilisé. Il manquait toutefois des carousels réactifs. C’est le cas de Elastislide qui profitera au mieux des caractéristiques de l’écran. Via @guerrier.

JbhSlider — Slider en jQuery

JbhSlider permet de réaliser des diaporamas en jQuery avec la particularité de gérer les évènements rapprochés. Il n’y aura pas d’effets indésirables quand vos visiteurs cliqueront dix fois de suite sur le lien «suivant» du Slider. Oui, les visiteurs font ça 🙂 Outre la gestion des liens «Suivants et Précédent, JbhSlider gère la pagination entre les diapos et permet des effets de transition.

Agile Carousel — Un diaporama agile et plein de ressources

Agile Carousel est un script qui permet de faire défiler automatiquement ou manuellement du texte et des images. Il existe des centaines de diaporama plus ou moins gourmands en ressources et possédant plus ou moins d’options. Agile Carousel semble un bon compromis entre le poids et les fonctionnalités. Le format de données JSON permettra à votre Slideshow de dialoguer avec les informations issues de votre CMS préféré.

Un diaporama pleine-page avec jQuery

Full background image slider est un script qui permet d’afficher un diaporama occupant toute la fenêtre du navigateur (ou le container que vous voulez). Outre le changement de background de votre site — ce qui pourrait s’avérer fatiguant pour les yeux –, ce script pourra se rendre utile pour présenter des visuels sur une page séparée.

Slides — Slideshow jQuery

SlideJs est un Slideshow Javascript développé avec jQuery pour afficher vos images sous forme de diaporama. SlideJs est simple à utiliser et propose de nombreuses options : auto-rewind, auto-play, effets de fading et de transitions, préchargement d’images, pagination automatique, etc. Compatible avec Internet Explorer 7/8/9, Firefox 3+, Chrome, Safari, Safari Mobile et même IE6 ! Slides est disponible sur Github. Via Pierre Vion.

TinyFader — Slideshow poids-plume avec effet de fading

TinyFader — Malgré son nom, la particularité de ce diaporama n’est pas de proposer des effets de transitions à base de fading. C’est plutôt son poids — 1,4 KB seulement — qui mérite le détour ! Il s’agit d’une variante de TinySlider en version autonome : TinyFader n’a pas besoin d’un framework Javascript pour fonctionner. L’initialisation et le paramétrage de TinyFader sont très simple :