CODEWITHSUNDEEP
jqueryjquery-uijquery-ui-slider
CJS
CJS

Reputation: 351

Difficulties implementing the JQuery Ui Slider

I've implemented the jQuery slider UI in the page below but it doesn't seem to be initialising.

Test Page

I loaded it up in Firebug and I got the following error:

$("#slider-range").slider is not a function
[Break On This Error]   

slide: function( event, ui ) {

Upvotes: 1

Views: 1406

Answers (1)

Starx
Starx

Reputation: 79041

You have not included the JQuery UI Library. Only included the jQuery is not enough.

You can use CDN to include the UI library.

  1. JQuery CDN:

    <script src="http://code.jquery.com/ui/1.8.18/jquery-ui.min.js" type="text/javascript"></script>

  2. Google CDN:

    <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js' type='text/javascript'></script>

Include one of those, or, even better, read this Getting Started Docs.

UPDATES

You have to include the CSS files, to properly view the UI elements. Include the following CSS file

http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/ui-lightness/jquery-ui.css

See your slider in action here

Upvotes: 2

Related Questions