-
Notifications
You must be signed in to change notification settings - Fork 3
jQuery rangeslider basic setup
Maikel Bos edited this page Jan 9, 2020
·
1 revision
Include the following script files and the style sheets in your page(s). The style sheet jquery-rangeslider.style.css
is optional and provides basic styling; skip this or use it as a template if you want to provide your own styling. If you have installed the NuGet package you should find the script files in the Scripts folder and the style sheet in the Content folder.
<link rel="stylesheet" href="Content/jquery-rangeslider.min.css" />
<link rel="stylesheet" href="Content/jquery-rangeslider.style.min.css" />
<script type="text/javascript" src="Scripts/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="Scripts/jquery-rangeslider.min.js"></script>
The plugin can be used to transform any element into a range slider simply by calling the rangeslider
function on the jQuery object. It supports creating multiple sliders at the same time for a jQuery object containing more than one element.
<div id="example-rangeslider">
</div>
<script type="text/javascript">
$('#example-rangeslider').rangeslider();
</script>