Responsive JQuery Imageslider Plugins

By

Imagesliders are great for creating some life on your website, and with the boom of javascript libraries such as jquery, everyone and their mother has one on their website. Here are a selection of plugins for jquery that looks great, even on your mobile device.

Flexslider 2

A slider with lots and lots of settings and works wonderfully on any device I could find. This plugin really does have a feature for everything you can think of.

Find it here: http://www.woothemes.com/flexslider

Responsive-Slides

Light-weight (1 kb!), but with all the features you need except maybe swipe support. Can be a great solution if you don’t need all the fancy things most sliders offer.

Find it here: http://responsive-slides.viljamis.com

PhotoSwipe

Great plugin that focuses very much on the mobile experience. Has a great gallery style setup with very nice controls, even for fat fingers.

Find it here: http://photoswipe.com

Camera

Lots of different animations and the ability to make mobile only settings easilly is a godsend for mobile designers. A bit on the heavy side for my taste.

Find it here: http://www.pixedelic.com/plugins/camera

Full-screen slider

It’s not often that I find use for a full-screen slider, but it might be more useful on mobile devices. It doesn’t need to be run in fullscreen, but it’s clear to see that that is the intention.
Note: The blog hosting this plugin is in french.

Find it here: http://m.demo.sutunam.com/slider/full-screen

SwipeJS (Not jquery dependant)

Swipe is a lightweight mobile slider with 1:1 touch movement, resistant bounds, scroll prevention, and completely library agnostic, which is great for some projects.

Find it here: http://swipejs.com

An interesting one!

Do you want to use your current slider but do you want to enable swipe. Then you can try the touch punch plugin. It emulates click events on touch devices.

Find it here: https://github.com/furf/jquery-ui-touch-punch

So there you have it. No reason to give your mobile visitors a sub-par experience. Have a good one.




Respond!