A jQuery minimalist slider
There are a lot of jQuery slider plugins out there. Each one has a lot of features built in. This is great for beginners who just want a plug-and-play slider plugin. However, problems arise when the design gets complex and the plugin's elements don't match your designer's vision.
Bare Bones Slider is a jQuery slider for developers. The biggest strength of this slider isn't what it does; it's what it doesn't do. By default, all extra elements are off; developers can add new functionality without having to undo the plugin's "helpful" features. Beginners can use pre-coded options, while experts can control it using public methods.
Triggering CSS3 transitions manually
The initial release of this plugin used jQuery's animate function for its animations. Eventually, I added CSS transitions instead for better hardware acceleration.
One big hurdle was that the slider needed to position the next slide before animating it. Previously, I could position the element with jQuery's css function and animate it with jQuery's animate function. Attempting to achieve this with the transition property in CSS3 produced some weird results.
Initially, I tried to add a class that had transition:none, position the element, remove the class which should have re-enabled animations, and apply the final coordinates. The actual result was that the element animated from out of unexpected places.
My chosen solution for now is just to separate the reset and animate functions with a setTimeout to make sure the browser doesn't skip over steps.