<style type="text/css">
.withslider {
  height:15px;
}
.slider-container {
  margin-bottom: 0.5em;  
  margin-top: 1.5em;
}
.slider-handle {
   height:10px;
   top: 0;
}
</style>

<input id="answer394512X96X16168SQ001" class="text form-control pull-left empty em_sq_validation good" name="394512X96X16168SQ001" onkeyup="fixnum_checkconditions(this.value, this.name, this.type)" maxlength="25" data-slider-value="" data-slider-min="0" data-slider-max="1000" data-slider-step="50" data-slider-orientation="horizontal" data-slider-handle="triangle" data-slider-tooltip="always" data-slider-reset="0" data-slider-prefix="" data-slider-suffix="" data-separator="." style="display: none;" data-value="0" type="text">

<style type="text/css">
.withslider {
  height:15px;
}
.slider-container {
  margin-bottom: 0.5em;  
  margin-top: 1.5em;
}
</style>

<script type="text/javascript" charset="utf-8">  
  $(document).ready(function() {
 
    // Identify this question
    var thisQuestion = $('#question{QID}');
 
    // Add some classes
    $('tr.question-item', thisQuestion).each(function(i) {
      $('td:eq(0)', this).addClass('with-label');
      $('td:eq(1)', this).addClass('with-slider');
    });
 
    // Insert the sliders
    $('input[type="text"]', thisQuestion).each(function(i) {
      var thisVal = $(this).val();
      if(thisVal == '') {
        thisVal = 0;
      }
      $(this).bootstrapSlider({
        'min': 0,
        'max': 1000,
        'step': 50,
        'value': Number(thisVal),
        'handle': 'triangle',
        'tooltip': 'always'
      });
    });
 
    // Listeners on the sliders for Expression Manager
    $('input[type="text"]', thisQuestion).on('slideStop', function(i) {
      fixnum_checkconditions(this.value, this.name, this.type, 'onchange',0)
    });
 
    // Some styling
    $('table.table-multi-num, table.table-multi-num tbody', thisQuestion).css({
      'display': 'block'
    });
    $('tr.question-item', thisQuestion).css({
      'display': 'block'
    });
    $('tr.question-item td', thisQuestion).css({
      'display': 'block'
    });
    $('tr.question-item td.with-label', thisQuestion).css({
      'padding-bottom': '1.5em',
      'text-align': 'left'
    });
    $('tr.question-item td.with-slider', thisQuestion).css({
      'padding-bottom': '2.5em',
    });
    });
</script>