It’s been forever since I’ve posted here, due to being busy with a great responsive design project. However, the project is over now, and now that the holidays are behind us I’m focussing on a lot of the little projects I’ve had on the back burner for awhile.
One of those is dealing with something that came up on my last contract: the jQuery “jumping” bug with slideUp, slideDown and slideToggle. If you’re not familiar with it, check out Remy Sharp’s great screencast on the issue.
So I’ve made my first attempt at writing a jQuery plugin from scratch to deal with this issue. The result is BetterSlide which is intended to be a replacement to the native slideUp/slideDown/slideToggle calls. Complete documentation is below.
You can download the plugin from GitHub.
This plugin is very much in beta, so I’m looking for any and all feedback, especially bug reports, you can throw my way. Thanks.
Documentation
BetterSlide Plugin
Replaces jQuery’s native SlideUp/SlideDown/SlideToggle functionality to eliminate the “jump” bug.
Version 1.0b
Updated 2012-01-17
License: MIT (https://github.com/jquery/jquery/blob/master/MIT-LICENSE.txt)
Usage:
$(‘element’).betterSlide( { options } );
BetterSlide Options
action: ‘toggle’; Slide action desired. Also accepts ‘up’ or ‘down’
duration: 400; time in milliseconds for animation. Also accepts ‘fast’ (200 milliseconds) and ‘slow’ (600 milliseconds)
easing: ‘swing’; Desired easing effect. Supports any easing effect you have installed, including jQuery UI effects.
callback: ”; Function to perform upon completion of the animation
Alternate Usage (to more closely match native jQuery commands):
$(‘element’).betterSlideUp( { options } );
$(‘element’).betterSlideDown( { options } );
$(‘element’).betterSlideToggle( { options } );
The same options are recognized, except for the “action” option.