NoUiSliderツールチップ

Question

noUisliderを使用してスライダーを作成しました。ツールチップを隠して表示するにはどうしたらいいですか？

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

まず、見つけるツールチップ：var tt = slider.querySelector('.noUi-tooltip');を

は、ここで私がこれまで持っているものです。

次に、CSSで定義したhiddenクラス（たとえば、.hidden { display: none; }）：tt.classList.toggle('hidden')を切り替えることができます。

Answer 2

noUiSliderはあなたが尊敬イベント

上のツールチップのオプションを切り替えることができ、更新オプション機能

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

を持っています