jQuery UI Slider example

Also includes clever regEx formatting of numbers.

HTML

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
 <!--  The div that is used as the slider container  -->
  <div id="slider" ></div>
  
  <!--  The div that is used to display the slider value  -->
  <div id="amount" style="color:#777;font-size:72px;text-align:center;"></div>

JavaScript

// When the browser is ready...
  $(function() {
        
      window.formatComma2 = function(val) {
          return val.toString().replace(/\B(?=(?:\d{3})+(?!\d))/g, ",");
      };

         // Create a new jQuery UI Slider element
    // and set some default parameters.
    $( "#slider" ).slider({
      range: "min",
      value: 50,
      min: 0,
      max: 100,
      slide: function( event, ui ) {
        // While sliding, update the value in the #amount div element
        $( "#amount" ).html( "$" + formatComma2(ui.value * 1000) );
      }
    }); 

    
    // Set the initial slider amount in the #amount div element
    var value = $( "#slider" ).slider( "value" );
      //console.log("$" + formatComma(parseInt(value) * 1000));
    $( "#amount" ).html( "$" + formatComma2(parseInt(value) * 1000) );                  
  });