NoUislider改變塊元件

Question

我想要通過使用noUiSlider改變一個div或圖像的不透明度上不透明度，但它不會顯示該塊。我錯過了什麼？

var opacitySlider = document.getElementById("slider"); 
 

 
     noUiSlider.create(opacitySlider, { 
 
      behaviour: 'drag', 
 
      start: 0, 
 
      range: { 
 
       min: 0, 
 
       max: 1 
 
       } 
 
      }); 
 
      
 
     var o = opacitySlider.noUiSlider.get(); 
 
      
 
     var changeOp = 
 
      document.getElementById("block").style.opacity = o ;

任何幫助或建議將是巨大的。 Fiddle here。

Answer 1

移動你的不透明度分配到更新方法：

opacitySlider.noUiSlider.on('update', function(values, handle){ 
    document.getElementById("block").style.opacity = values[handle] ; 
    directionField.innerHTML = values[handle]; 
}); 

你只是一次調用它，在頁面加載。