NoUislider更改块元素

Question

我想使用noUiSlider更改div或图像的不透明度，但它不会显示块。我错过了什么？

＆＃13;

＆＃13;

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 ;

＆＃13;

＆＃13;

＆＃13;

任何帮助或建议都会很棒。 Fiddle here

Answer 1

将不透明度分配移动到更新方法中：

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

您在页面加载时只调用一次。