NoUislider modifier l'opacité sur l'élément de bloc

Question

Je souhaite modifier l'opacité d'une div ou d'une image en utilisant noUiSlider, mais le bloc ne sera pas affiché. Qu'est-ce que je rate?

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 ;

Toute aide ou des conseils serait génial. Fiddle here.

Answer 1

Déplacez votre tâche d'opacité dans la méthode de mise à jour:

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

Vous appeliez juste une fois, la charge de page.