如何通过javascript设置-webkit-mask-box-image？

Question

我有id="container'的div，我想设置-webkit-mask-box-image。目前我通过css：

#container
{
-webkit-mask-box-image: url('masks/4.png');
width:235px;
height:300px;
}

但是我想通过javascript设置css，因为掩码应该每小时更改一次。

我试过了：

document.getElementById("container").setAttribute("style", "-webkit-mask-box-image: url('masks/"+hour+".png'); width:235px; height:300px;");

但这不起作用。我该怎么做？

Answer 1

你可以通过下面的代码行在JQuery中设置，这是 DEMO

$('#container').css('-webkit-mask-box-image',"url('masks/4.png')")

Answer 2

怎么样

document.getElementById("container").style.setAttribute("-webkit-mask-box-image", "url('masks/"+hour+".png')");
document.getElementById("container").style.setAttribute("width","235px");
document.getElementById("container").style.setAttribute("height","300px");