jquery - NoUiSlider 工具提示

Question

使用 noUislider 制作了一个 Slider。如何隐藏和显示工具提示？

这是我到目前为止所拥有的：

var slider = document.getElementById('slider');

noUiSlider.create(slider, {
    start: [10],
    connect: "lower",
    tooltips: [wNumb({decimals:0})],
    orientation:"vertical",
    direction:"ltr",
    range: {
        'min': 000,
        'max': 100
    }
});

slider.noUiSlider.on('start', function(){
    ;
});

slider.noUiSlider.on('end', function(){
    ;
});

Answer 1

noUiSlider 有一个更新选项功能

updateSlider.noUiSlider.updateOptions({
      tooltips: false
});

您可以在受人尊敬的事件上切换工具提示选项

Answer 2

首先，找到工具提示：var tt = slider.querySelector('.noUi-tooltip');.

然后你可以切换hidden你在 CSS: (eg .hidden { display: none; }):中定义的类tt.classList.toggle('hidden')。