为什么这个JavaScript css过滤代码可以在Firefox中工作，而不能在Chrome中工作？

这些过滤器在Firefox（43.0.1）中协调工作，但在Chrome（57.0.2987.133）中不协调工作。在Chrome中，当我将鼠标移到另一个滑块上时，上一个滑块的调整将被删除。关于图像过滤器也有一个类似的问题，但它确实适用于Firefox与Chrome的问题

var度=0；
var百分比b=100；
var百分比c=100；
函数setValues（）{
表1.亮度值=100；
表1.对比度值=100；
表1.hue.value=0；
}
函数bright（）{
percentB=form1.brightness.value；
document.getElementById（“I”）.style.filter=“亮度（“+parseInt（percentB）+“%”）“+”对比度（“+parseInt（percentC）+“%”）“+”色调旋转（“+parseInt（度）+”度）”；
}
函数cont（）{
百分比c=form1.contrast.value；
document.getElementById（“I”）.style.filter=“亮度（“+parseInt（percentB）+“%”）“+”对比度（“+parseInt（percentC）+“%”）“+”色调旋转（“+parseInt（度）+”度）”；
}
函数色调（）{
度=form1.hue.value；
document.getElementById（“I”）.style.filter=“亮度（“+parseInt（percentB）+“%”）“+”对比度（“+parseInt（percentC）+“%”）“+”色调旋转（“+parseInt（度）+”度）”；
}

亮度：对比度：色调：

在与此争论了两个小时后，我终于看到了一个解决方案：将所有内容合并到一个函数中

新HTML：

   <img src="xbutterfly.jpg" alt="Colorful Flowers" width="800" height="533" id="I" /><br><br>  
   <form name="form1" id="form1id" style="font-size:90%; text-align:center;">
    Brightness: <input type="range" name="brightness" min="0" max="200" step="5" onmousemove="apply()" style="vertical-align:-7px;" />&nbsp; &nbsp;
    Contrast: <input type="range" name="contrast" min="0" max="200" step="5" onmousemove="apply()" style="vertical-align:-7px;"/>&nbsp; &nbsp;
    Hue: <input type="range" name="hue" min="0" max="360" step="5" onmousemove="apply()" style="vertical-align:-7px;"/> 
   </form>

亮度：
对比度：
色调：

新JavaScript：

  <script type="text/javascript">
  <!--

  var degrees = 0;
  var percentB = 100; 
  var percentC = 100;

  function setValues()
  {      
    form1.brightness.value = 100;
    form1.contrast.value = 100;
    form1.hue.value = 0;      
  }

  function apply()
  { 
    degrees = form1.hue.value;
    percentC = form1.contrast.value;
    percentB = form1.brightness.value;  
    document.getElementById("I").style.filter = "brightness(" + parseInt(percentB) + "%)" + " contrast(" + parseInt(percentC) + "%)" + " hue-rotate(" + parseInt(degrees) + "deg)";   
    document.getElementById("I").style.WebkitFilter = "brightness(" + parseInt(percentB) + "%)" + " contrast(" + parseInt(percentC) + "%)" + " hue-rotate(" + parseInt(degrees) + "deg)"; // Not tested as I don't have these browsers. Used for older versions of Safari, Chrome, and Opera per https://www.w3schools.com/jsref/prop_style_filter.asp  
  }

  --> 
  </script>  

它适用于我的FF和chrome您使用的是哪个版本的chrome？适用于我的chrome（57.0.2987.133）示例谢谢大家的意见！欢迎提出补充意见。