seiyria / bootstrap-slider
A less buggy fork of the original bootstrap slider found on http://www.eyecon.ro/ by Stefan Petre. It was forked so we could update the slider since the original wasn't under version control.
Installs: 21 179
Dependents: 2
Suggesters: 0
Security: 0
Stars: 0
Watchers: 2
Forks: 1 141
Language:JavaScript
- dev-master
- 4.8.1
- 4.8.0
- 4.7.4
- 4.7.3
- 4.7.2
- 4.7.1
- 4.7.0
- 4.6.4
- 4.6.3
- 4.6.2
- 4.6.1
- 4.6.0
- 4.5.7
- 4.5.6
- 4.5.1
- 4.5.0
- 4.4.1
- 4.4.0
- 4.3.0
- 4.2.0
- 4.1.4
- 4.1.3
- 4.1.2
- 4.1.1
- 4.1.0
- 4.0.12
- 4.0.11
- 4.0.10
- v4.0.8
- v4.0.7
- v4.0.6
- v4.0.5
- v4.0.4
- v4.0.3
- v4.0.2
- v4.0.1
- v4.0.0
- 3.1.0
- dev-fixing-vertical-slider
- dev-relayout-tests
- dev-tick_marks
This package is not auto-updated.
Last update: 2024-10-25 01:51:16 UTC
README
Originally began as a loose "fork" of bootstrap-slider found on http://www.eyecon.ro/ by Stefan Petre.
Over time, this project has diverged sigfinicantly from Stefan Petre's version and is now almost completly different.
Please ensure that you are using this library instead of the Petre version before creating issues in the repository Issue tracker!!
Installation
Clone the repository, then run npm install
Want to use bower? bower install seiyria-bootstrap-slider
Want to use npm? npm install bootstrap-slider
NOTE for NPM users: In order to keep the version numbers in our dist/ file consistent with our Github tags, we do a patch version bump, generate a new dist, and create a commit/tag on postpublish.
This does mean the Github repo will always be one patch commit off of what is published to NPM. Note that this will not affect functionality, and is only used to keep package management system files and the dist file version numbers in sync.
Basic Setup
Load the plugin CSS and JavaScript into your web page, and everything should work!
Remember to load the plugin code after loading the Bootstrap CSS and JQuery.
JQuery is optional and the plugin can operate with or without it.
Look below to see an example of how to interact with the non-JQuery interface.
Supported Browsers
We only support modern browsers!!! Basically, anything below IE9 is not compatible with this plugin!
Examples
You can see all of our API examples here.
Using bootstrap-slider (with JQuery)
Create an input element and call .slider() on it:
// Instantiate a slider var mySlider = $("input.slider").slider(); // Call a method on the slider var value = mySlider.slider('getValue'); // For non-getter methods, you can chain together commands mySlider .slider('setValue', 5) .slider('setValue', 7);
What if there is already a slider plugin bound to the JQuery namespace?
If there is already a JQuery plugin named slider bound to the JQuery namespace, then this plugin will take on the alternate namespace bootstrapSlider.
// Instantiate a slider
var mySlider = $("input.slider").bootstrapSlider();
// Call a method on the slider
var value = mySlider.bootstrapSlider('getValue');
// For non-getter methods, you can chain together commands
mySlider
.bootstrapSlider('setValue', 5)
.bootstrapSlider('setValue', 7);
Using bootstrap-slider (without JQuery)
Create an input element in the DOM, and then create an instance of Slider, passing it a selector string referencing the input element.
// Instantiate a slider var mySlider = new Slider("input.slider", { // initial options object }); // Call a method on the slider var value = mySlider.getValue(); // For non-getter methods, you can chain together commands mySlider .setValue(5) .setValue(7);
Using as CommonJS module
bootstrap-slider can be loaded as a CommonJS module via Browserify, Webpack, or some other build tool.
var Slider = require("bootstrap-slider");
var mySlider = new Slider();
Note that the JQuery dependency is considered to be optional. For example, to exclude JQuery from being part of your Browserify build, you would call something like the following (assuming main.js is requiring bootstrap-slider as a dependency):
browserify -u jquery main.js > bundle.js
Please see the documentation for the specific CommonJS loader you are using to find out how to exclude dependencies.
Options
Options can be passed either as a data (data-slider-foo) attribute, or as part of an object in the slider call. The only exception here is the formatter argument - that can not be passed as a data- attribute.
Functions
NOTE: Optional parameters are italicized.
Events
Version Bumping and Publishing (Maintainers Only)
To bump the version number across all the various packagement systems the plugin is registered with, please use the grunt bump plugin.
- grunt bump:patch - patch version bump, 0.0.0 -> 0.0.1
- grunt bump:minor - minor version bump, 0.0.0 -> 0.1.0
- grunt bump:major - major version bump, 0.0.0 -> 1.0.0
After bumping, type npm publish
to update on NPM.
Other Platforms & Libraries
Maintainers
- Kyle Kemp
- Rohit Kalkur
- Twitter: @Rovolutionary
- Github: rovolution