如何使用Javascript更改图像色调

Question

我正在尝试使用JavaScript、HTML和CSS制作图像色调变化器。问题在于我需要使用JavaScript来改变图像的色调。我尝试使用 document.getElementById("output").style，但是色调并没有任何改变。我能够使用HTML和CSS更改色调：

HTML: <img id="output" width="0" height="0" style="border: 0px solid black" class="huerotate"> CSS: .huerotate {-webkit-filter: hue-rotate(180deg);}。

我还没有能够使用JavaScript复制这个效果。

- user9772275

Answer 1

这个属性被称为filter（忽略webkit），与hue无关。

document.getElementById("output").style.filter = "hue-rotate(180deg)";

或者使用 webkitFilter ：

document.getElementById("output").style.webkitFilter = "hue-rotate(180deg)";

- Jack Bashford

Answer 2

像这样做： (element).style.filter = "hue-rotate(180deg)";

至少我认为您是想这样做。 希望有所帮助！GL

编辑：我忘记向元素添加样式属性了。

- frogDoraTheRollerskatingFedora