My favorite slider script

Animated sliders are some of the most populate elements in website design. Some people might argue that they have gone by the wayside or are played out these days but I would argue that they are here to stay. Content and image sliders can be one of the most space efficient ways to get a mix of content in front of your page viewer quickly and without requiring much work from them.

There are a million ways to make content appear and disappear on your page. The goal of a slider isn’t always to slide, but to allow content to easily rotate through in a single space without effecting the rest of the page. This can be achieved in a basic sense with CSS3 or straight up javascript if you wanted to use any number of snippets out there or to roll your own. I prefer to use a pre-made slider script that is both feature rich and lightweight.

My choice is the Flexslider by woothemes. It is not a WordPress plugin, it is simply a jQuery plugin that makes use of the jQuery library in order to animate your content in and out of frame.

Why do I prefer flexslider?

  • its lightweight
  • the documentation is very well written
  • it has over 50 features to customize to your own needs
  • it can slide images and HTML content
  • it’s super fast to plug and play

Flexslider being lightweight is one of the main reasons I like it. The files are small and it does not require a large amount of structure and code to get it running. All you need is a container with the class .flexslider and an unordered list with the class .slides and the little initialization code placed in the header and you are good to start!

Try it out and let me know what you think. Have your own favorite slider script? Post it in the comments and I will check it out.

Check out this simple tutorial on how to make a slider with flexslider and the Pods Framework.

How to update the url path for each slide for deep linking with flexslider

The_Idiot

About Lindsay

Self made millionaire.. Oops I mean web developer.. who started out learning how to build websites with tables and dreamweaver, I now almost entirely focus on CMS-based development, usually WordPress. I love coding and designing and regularly switch between my left and right brains.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">