Range Slider is not Working

Question

I am creating a range slider is not working Saleforce. I got code from this side http://ghusse.github.io/jQRangeSlider/documentation.html#bindingEvents and i am sharing my code with you.

<apex:page standardController="Account" extensions="SliderPageCtrl" sidebar="false">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

<apex:stylesheet value="{!URLFOR($Resource.rangeslider,'/css/iThing.css')}"/>
<apex:stylesheet value="{!URLFOR($Resource.rangeslider,'jQEditRangeSlider-min.js')}"/>



     <h1>Hello world</h1>
    <div id="slider"></div>

    <script>

      $("#slider").editRangeSlider();

   </script>

</apex:page>

and this error on my Consoler

Answer 1

Here is a updated version of the code and is working for me. I Have uploaded iThing.css as iThing and jQRangeSlider-min.js as jQRangeSlider in static resources. Hope this will help.

<apex:page standardController="Account" sidebar="false">

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

    <apex:stylesheet value="{!$Resource.iThing}" />
    <script type="text/javascript" src="{!$Resource.jQRangeSlider}"/>

    <h1>Hello world</h1>
    <div id="slider"></div>
    <script>
        $("#slider").rangeSlider();
    </script>

</apex:page>