June 9, 2011 7

Flux Slider v1.3 Released


Flux 1.3

Flux Slider v1.3 is now ready for download! As always you can see it in action on the demo site and grab the source from GitHub. This new release has quite a few bug fixes and improvements but here are some of the headlines.

Whats new in v1.3

Two new 3D transitions (tiles3d & blinds3d)

A massive thanks to @altryne for porting his excellent Portal2 inspired transition to the Flux library as tiles3d. I’ve also added a similar transition called blinds3d. Both can be viewed in the Transition Gallery.

As an aside, now that Chrome 12 is out and supports 3D transforms by default, even more people will be able to experience the 3D transition effects in Flux!

New jQuery Widget

A new jQuery widget has been added for those that want to use Flux with the convenience of jQuery’s chaining methods.

This means that you can also now initialise Flux like this:

    window.myFlux = $('#slider').flux({
        autoplay: false,
        pagination: true

All the native API methods are also available via the jQuery widget, for more information see the documentation on GitHub.

Note: The jQuery widget is not compatible if you plan to use the Zepto framework.

Added support for Modernizr

Flux will now make use of Modernizr for feature detection, if it is available. Thanks to Modernizr’s Faruk Ates for this suggestion!

Note: Flux does not require Modernizr and will fallback to its own feature detection code when its not found.

Full Change Log

  • Made it easier to handle 3d transitions by moving the overflow logic into flux.transition.js
  • Fixed a bug where 3d transitions could leave the viewport in an overflow: visible state.
  • Ensured event object is sent to callback for .transitionEnd() helper function
  • Updated zepto.js to v0.6
  • Added a short 5ms delay before transition execution as Zepto sometimes failed to catch the transitionEnd() with some 3D transitions
  • Added ’tiles3d’ & ‘blinds3d’ transitions. Thanks to Altryne (twitter.com/altryne) for porting his ’tiles3d’ code to Flux!
  • Improved performance by using Document Fragments to reduce DOM reflows.
  • Added support for Modernizr feature detection with a fallback to custom detection code.
  • 3D transformations are removed from the list of loaded transitions when the browser does not support 3D.
  • Added a jQuery widget for better integration with jQuery.
  • Anonymous

    Awesome!! :D More transitions on the way! Very nice timing with the release of chrome 12 and iOS 5 beta

  • http://www.joelambert.co.uk Joe Lambert

    Yeah the timing is a happy coincidence! Especially love the fact that Chrome now does 3D, means so many more people get to see the transitions!

  • Uceceo

    Great work Joe!…would you have time to add a horizontal slide transition to the gallery?…I’m trying to convert my jquery gallery to css3 transitions…so it will slide the width of the viewport or image when I click previous/next

  • http://www.joelambert.co.uk Joe Lambert

    I will add this to the list and try get this implemented ASAP!

  • http://www.joelambert.co.uk Joe Lambert

    This is now available in the GitHub repository https://github.com/joelambert/Flux-Slider/commit/2cd9dafbae607346f8fef4c0df62375bf56e4a21 & will be officially available in the next release.

  • Uceceo

    U da man Joe!

  • http://www.joelambert.co.uk Joe Lambert

    Thanks! Drop me a link to your site when it’s done, love seeing Flux in use.