Design your way

Monday, October 19, 2015

JQuery has overpowered Flash a few years ago in a lot of web uses, becoming a very powerful tool for web designers. One of these uses that I’m referring to is the image slider.

Implementing this feature in your site will definitely count as a big plus so don’t waste your time and download the available jQuery plugins in this article.

If there is a jQuery slider that you need, you’ll find it here.

PhotoSwipe: JavaScript gallery, no dependencies

PhotoSwipe

PhotoSwipe is the first open-source gallery to support JavaScript-based image zooming. Even if a browser’s native zooming has been disabled, image zooming will still work.

All basic gestures are supported: flick to the next or previous image, spread to zoom in, drag to pan, pinch to zoom out or close, tap to toggle the controls, double-tap to zoom.

Swiper

Swiper

Swiper – is the free and most modern mobile touch slider with hardware accelerated transitions and amazing native behavior. It is intended to be used in mobile websites, mobile web apps, and mobile native/hybrid apps. Designed mostly for iOS, but also works great on latest Android, Windows Phone 8 and modern Desktop browsers

FlexSlider

FlexSlider

FlexSlider was built to serve up the best responsive jQuery slider around. The author had built a few implementations of responsive sliders on different client projects and noticed that there was a glaring hole for plugin support with the concept.

He wanted to build a plugin that would serve the newest of beginners, while providing seasoned developers a tool they could use with confidence. What has come forth is this, FlexSlider.

bxSlider

bxSlider

The fully-loaded, responsive jQuery content slider

Why should I use this slider?

  • Fully responsive – will adapt to any device
  • Horizontal, vertical, and fade modes
  • Slides can contain images, video, or HTML content
  • Full callback API and public methods
  • Small file size, fully themed, simple to implement
  • Browser support: Firefox, Chrome, Safari, iOS, Android, IE7+
  • Tons of configuration options

OWL Carousel

OWL Carousel

Touch enabled jQuery plugin that lets you create beautiful responsive carousel slider.

Sequence.js

Sequence.js

Sequence.js is a JavaScript library that provides a responsive CSS framework for creating unique sliders, presentations, banners, and other step-based applications.

ResponsiveSlides.js

ResponsiveSlides.js

ResponsiveSlides.js is a tiny jQuery plugin that creates a responsive slider using elements inside a container. It has been used on sites like Microsoft’s Build 2012 and Gridset App.

ResponsiveSLides.js works with wide range of browsers including all IE versions from IE6 and up. It also adds css max-width support for IE6 and other browsers that don’t natively support it. Only dependency is jQuery (1.6 and up supported) and that all the images are same size.

Vegas

Vegas

Vegas is a jQuery/Zepto plugin to add beautiful backgrounds and Slideshows to DOM elements.

Galleria

Galleria

Galleria is a JavaScript image gallery framework that simplifies the process of creating beautiful image galleries for the web and mobile devices. Just copy/paste a few lines of code, add some photos or videos and pop a fully featured gallery in your browser.

Galleria supports native-like swipe movements and uses hardware optimized animations for ultra-smooth image browsing on mobile and touch devices. Pull galleries, sets and movies from several sources into a Galleria gallery with just a few lines of code.

SlidesJS

SlidesJS

Slides is a crazy simple slideshow plugin for jQuery. With features like looping, auto play, fade or slide transition effects, crossfading, image preloading, and auto generated pagination. With Slides you’ll never see multiple slides fly by. Slides elegantly just slides from one slide to the next.

Fotorama

Fotorama

JQuery lightSlider

JQuery lightSlider

JQuery lightSlider is a lightweight responsive Content slider with carousel thumbnails navigation

TremulaJS

TremulaJS

TremulaJS is a client-side javascript UI component providing Bézier-based content-stream interactions with momentum & physics effects for mouse, scroll and and touch UIs.

Flux Slider

Flux Slider

Flux slider is a CSS3 animation based image transition framework, inspired in part by the fantastic Nivo Slider jQuery plugin.

Instead of the traditional Javascript timer based animations used by jQuery, Flux utilises the newer, more powerful CSS3 animation technology. Its in a fairly early/rough state at the moment but testing on the iPhone/iPad does appear to produce much smoother animations. Desktop performance (as with Nivo) is very smooth but the use of CSS3 enables us to produce some new effects that Nivo can’t, e.g. rotations.

The aim is to use hardware acceleration where possible to improve performance on less powerful devices, such as mobiles & tablets.

Cycle2

Cycle2

Cycle2 is a versatile slideshow plugin for jQuery built around ease-of-use. It supports a declarative initialization style that allows full customization without any scripting. Simply include the plugin, declare your markup, and Cycle2 does the rest.

Three Sixty Image slider plugin

Three Sixty Image slider plugin

This is a jQuery plugin to create 360 degree product image slider. The plugin is full customizable with number of options provided. The plugin have the power to display images in any angle 360 degrees. This feature can be used successfully in many use cases e.g. on an e-commerce site to help customers look products in detail, from any angle they desire.

Microfiche.js

Microfiche.js

A carousel library made With Associates, focusing on performance, simplicity and touch.

Blueberry

Blueberry

Blueberry is an experimental opensource jQuery image slider plugin which has been written specifically to work with fluid/responsive web layouts.



Source: http://ift.tt/1oMxmAs

No comments:

Post a Comment

 

The Cash Box Blueprint

Most Reading