Skip to content
Mottie edited this page Aug 26, 2012 · 3 revisions

Wiki Pages: Home | FAQ | Setup | Options | Events | Theme | Change

Features

  • Numerical slider similar to the jQuery UI Slider - currently it only works with percentages (0-100%)
  • This slider follows a bezier path. The parameters are set using the pathslider builder.
  • Designed to work in older browsers (no canvas support), just add the path as a background image.
  • Get and set the slider position dynamically.
  • Slider handle (grip) can be set to rotate along with the angle of the curve (uses css3).
  • Callback events are available: create, update, start, slide, change, and stop.
  • The slider itself works in all browsers: IE6+, Opera, Chrome, Firefox and Safari (known issues below)

Main Demos

Other Demos

Known Problems

  • The grip/handle will work if the loop folds back on itself - try these points to see an example: 75,200,200,-125,-200,0,225,200
  • The S-Curve demo seems to get stuck near 100% but only in Firefox and on the demo page. It works fine when isolated. The grip isn't staying centered under the cursor like it does in Chrome.
  • Safari for Windows likes to start with the grip in the upper left corner of the slider box... most of the time when I hover over it, it jumps to where it should be... wow that is so weird. Also, the "S" curve demo doesn't want to work at all...

Dependencies

  • jQuery 1.4.4+
  • A browser that supports canvas (needed for the builder; optional for the pathslider plugin itself).
  • A browser that supports css3 transforms (necessary to rotate the grip).

Licensing

Clone this wiki locally