3 Great JavaScript Premium Sliders

JavaScript with its jQuery and D3 libraries has had a strong set of  routines for graphics and sliders. But with the push coming from CMS and Online Commerce tools like WordPress, Shopify, and Magento, the quality of JavaScript  sliders has reached a new level of excellence. This review will look at 3 sliders[ Master Slider, Slider Revolution, and WowSlider] which run in JavaScript, WordPress and other environs with the following common capabilities:
1)Boxed, fullwidth, & fullscreen sliders that are responsive in fitting slideshows onto desktop, tablet, and phone devices;
2)Sliders supporting multiple transitions, captioning and animated layers;
3)Animated layers made-up of text, shapes, images, videos,HTML-blocks, audio, video, and other sliders;
4)Sliders with sophisticated navigation controls including arrows, tabs, thumbnails, touch swipe, keyboard, and mouse-wheel options
4)Slider layouts with distinctive and customizable stylings savable as reusable templates;
5)Slider editors that support simplified often drag and drop interactions/operations.
These sliders take the old simple fade or carousel sliders to a new level of sophistication. Here lised alaphabetically are 3 premium JavaScript sliders.


Master Slider – $17US, 1 website unlimited updates

Master slider delivers all the top notch features plus a solid UI interface:
jsslidemastsetup
As shown in the screen shot, Master Slider can draw from local files, WP Posts, Flickr, Facebook, Instagram and Woo-commerce image and other media resources. As well users can draw upon Sample Sliders for layout and design ideas.

Working on the slides  allows for a number of slider settings:
jsslidemastsetup2
This is followed by a fullscreen editor for each slide that allows for detail control of the slide transitions, captioning and adding of layers:
jsslidemastsetuplayers
Master Slider does not have all the animation objects available to Slider Revolution but certainly does have more layer options then WowSlider. Master Slider is also fairly easy to learn. Master Slider sits in the middle on costs – $17/website versus $26/website for Slider Revolution.


Slider Revolution – $14/website+$12 onetime for Visual Edit addon

Slider Revolution sits atop the very competitive premium WordPress Slider plugin market. In the last two years it has expanded it deployment reach to JavaScript,Drupal, OpenCart, Magento, and Prestashop. Here is  the setup screen:
jssliderev1stsetup
Slider Revolution provides about 2 dozen free slider templates to speed up development. Users can also load in their own saved sliders for reuse. These options do speed slider design and development.

The Slider Editor is chock full of options:
jssliderev2setup
The Slide Editor has seven tabs for editing and customizing each individual slide including use of image, video, html blocks for slide base element and then a awide range of transitions, links and navigation settings. But the biggest plus is the unlimited layers that can be scheduled to appear on the basic slide:
jssliderevslidesetup

Going beyond Master Slider, Slider Revolution offers broad options for layer animations and objects.Slider Revolution uses the Greensock.js animation interface to its advantage with the most flexible positioning, scaling and animation transition options.

There is a trade-off with so many slider options, a significant learning curve. But Slider Revolution helps in 3 ways. First, the templates provide examples of how to do attractive slider from full width using hero images to carousels with video slides. Second, the drag and drop interface considerably eases placing of animation layers and customizing their transitions. Finally, Theme Punch, Slider Revolution makers, have a good set of documentation including videos.

So Slider Revolution delivers top of the line slider features with an approachable development interface. Here is some sample results:
jssliderevresults
One hidden benefit is the ability to save sliders developed for WordPress and then use them in Magento or JavaScript.


WowSlider – $99/year for unlimited website usage

WowSlider has long had one of the widest set of deployment options including standalone HTML+JS, WordPress, Joomla, etc. It is also one of  the easiest to use slider interfaces:
jsslidewow1
Adding images and videos is very simple. Then to add captions and description for each slide is easy onto the form at the bottom of the WowSlider editor.

Next WowlSlider has a design property popup which helps complete the setup:
jsslidewow2props
Note that templates allow users to control the styling of captions, descriptions, and navigation controls for each slider. Wowslider does not allow setting these properties for individual slides. Also only captions are allowed for layer animations – not added images, videos,shapes as in Master Slider and Revoltion Slider.

But as noted the publishing options for WowSlider are quite robust:jsslidewow3pubs
Facebook support is unique among our 3 sliders.


Summary

The price and features do not determine a clear cut best sider. If you develop for a lot of websites where simple sliders and banner ads predominate, WowSliders ease of use and yearly price pays of if you are plan to develop sliders for 5 or more websites. Also the low learning curve makes WowSlider productive right away.

If layers animations are important [and its the latest trend in Web UI/UX], then its  achoce between Master Slider and Slider Revolution. Master is cheaper but S;ider Revolution has more features and deployment options- so our shop has adopted Slider Revolution.

But be forewarned, the rate of innovation in premium sliders is very high – just consider Smart Slider 3 and Layer Slider as examples. So the premium slider market is not yet a done deal.

Advertisements

About warkworth1

Web Designer and Developer that uses WordPress primarily but also Bootstrap, Foundation Zurb, Ink, and even Magento etc. Love teaching full stack developer tricks with HTML/CSS/JavaScript/PHP/SQL at WordCamps and on my blogs
This entry was posted in coding. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s