jQuery Slider Plugin & Tutorials with Example

Powerange : iOS 7 style range slider

Powerange : iOS 7 style range slider

Powerange is a range slider control, inspired heavily by iOS 7 and the “Power Rangers” TV series. It is easily customizable, both by CSS and JavaScript. With it’s many features, including changing color and overall style, switching between horizontal and vertical style, custom min, max and start values, custom step interval, displaying decimal values, displaying icons instead of min/max numbers, it is a really powerful UI tool to use on your website.

Master Slider – WordPress Responsive Touch Slider

Master Slider - WordPress Responsive Touch Slider

Master Slider WordPress is a premium high quality designed image and content slider for WordPress, with super smooth hardware accelerated transitions. It supports touch navigation with pure swipe gesture that you have never experienced before. It’s a truly responsive and device friendly slider which works perfect in all major devices. Master Slider is an awesome layer slider as well, with the ability of adding any HTML contents (texts, images, …) in layers. You almost have everything in Master slider which is the most complete among the best, hotspots, thumbnails, variety of effects, Video support and much more.

Theme Slider : jQuery FullScreen Touch Slider Plugin

Theme Slider : jQuery FullScreen Touch Slider Plugin

Modern Touch-Enabled FullScreen Slider with Unlimited Layers and Animations.

Features:

  • Responsive, Mobile-Friendly with Touch/Swipe Support
  • 91 Predefined Layer Positions, 650+ Font Styles (Google Fonts), 360+ Icons (Font Awesome Icons)
  • Unlimited Layers, Sublayers, Text Layers, Transitions, All of Them should be Animated
  • Compatible with All Major Browsers
  • Custom YouTube Player with Additional Options (Autoplay, Resize to Fit to the Screen, Loop, Hide Control Bar)
  • Customizable Animation Time, Delay for Each Main Slide, Sublayer, Text Layer, Custom Options for Text Animations
  • 80+ Animation Types, combined with Easing Effects you can create more than 300 Unique Animations
  • 10+ Main Slider Animations with Hardware Accelerated CSS3 Technology
  • 30+ Text Animations
  • 10+ Sublayer Animations with in and out animations including random type
  • 30+ Easing Effects
  • AutoPlay, Control Options (color, position for global or each slides)
  • Integrated Preloader with 5 custom animations

jQuery lightSlider : Touchable Responsive Content Slider

jQuery lightSlider : Touchable Responsive Content Slider

jQuery lightSlider is a lightweight responsive Content slider.

Features:

  • Fully responsive – will adapt to any device.
  • Supports touch devices and swiping.
  • Gallery mode to create an image slideshow with thumbnails
  • Small file size (6kb) (minified), fully themed, simple to implement.
  • CSS transitions with jQuery fallback.
  • Full callback API and public methods.
  • Auto play and auto loop to create a content carousel.
  • Keyboard, arrows and dots navigation.
  • Chrome, Safari, Firefox, Opera, IE7+, IOS, Android, windows phone.
  • Slide and Fade Effects.
  • Multiple instances on one page.

Devrama Slider – jQuery Plugin

Devrama Slider - jQuery Plugin

‘Devrama Slider’ is a image slider with many features. It support both images and HTML contents.

Accordion Slider – Responsive jQuery WordPress plugin

Accordion Slider - Responsive jQuery WordPress plugin

Accordion Slider is a fully responsive and touch-enabled WordPress plugin that combines the functionality of an accordion with that of a slider.

  • Fully Responsive – automatic or custom responsiveness.
  • Touch-enabled – touch-swipe and tap on mobile screens, mouse drag on desktops.
  • Dynamic Content – load images and content from posts, galleries and Flickr.
  • Automatic Updates -update the accordion directly from the Dashboard.
  • Pagination -add as many panels as you want without worrying about screen space.
  • Smooth animations – uses CSS3 transitions and RequestAnimationFrame.
  • Retina-ready – specify a retina version for each image.

PgwSlider : Responsive slider for jQuery

PgwSlider : Responsive slider for jQuery

PgwSlider is a responsive slider for jQuery / Zepto.

  • Fully responsive slider
  • Less than 2.5 KB (minified and gzipped)
  • All browsers support (desktop and mobile devices)
  • SEO compliant

jQuery Vertical News Slider

jQuery Vertical News Slider

A jQuery and CSS3-based slider module that displays news headlines on the left along with a preview image and brief description on the right. The “current” item is highlighted and switches automatically at intervals.

Inspiration for Item Transitions with CSS3 Animations

Inspiration for Item Transitions with CSS3 Animations

Some inspiration and ideas for item transitions considering different scenarios and use cases, including a small component, a full-width image header and a product image with a transparent background. State transitions are done using CSS Animations.

Hi Slider : jQuery eye-catching 2D/3D realistic Slider

Hi Slider : jQuery eye-catching 2D/3D realistic Slider

Hi Slider makes it easy for anyone to create awesome eye-catching 2D/3D realistic jQuery Slider without any programming skills. Creating an image gallery slider and making a customized WordPress slider plugin have never been so easy and intelligent, even non-coders can design gorgeous jQuery photo slideshow. You just need to “Click to Select”! You can publish a gorgeous slider for your website within minutes!



Best jQuery websites design awards