$.noUiSlider 垂直滑块，最大值在顶部，最小值在底部

Question

$.noUiSlider 滑块在使其垂直并尝试使用方向选项在顶部获得最大值和在底部获得最小值时无法正常工作。这是下面的代码

noUiSlider.create(document.getElementById('slider-range'), {
  start: [20, 50],
  direction: 'rtl',
  orientation: 'vertical',
  tooltips: [true,true],
  range: {
    'min': [ 10 ],
    'max': [ 90 ]
  }});

This is the output i'm getting

Answer 1

您应该尝试不使用 [ 和 ] 来包围您的最小值和最大值：

   noUiSlider.create(document.getElementById('slider-range'), {
      start: [20, 50],
      direction: 'rtl',
      orientation: 'vertical',
      tooltips: [true,true],
      range: {
        'min': 10,
        'max': 90
      }})

此处演示：https://codepen.io/andreds/pen/BJdYqx

这里有更多详细信息和文档： https://refreshless.com/nouislider/

$.noUiSlider 垂直滑块，最大值在顶部，最小值在底部

$.noUiSlider vertical slider with max value at top and min value at bottom

html

javascript

css

nouislider