获取ColorThief以更改框阴影颜色

Question

如何完成此脚本以编辑＃player1的框阴影颜色？

<script type="text/javascript">
$(window).ready(function(){
    var sourceImage = document.getElementById("art");
    var colorThief = new ColorThief();
    var color = colorThief.getColor(sourceImage);
    document.getElementById("player1").style.['box-shadow'] = "rgb(" + color + ")";
   });
</script>

同样在css中，我应该把什么放在

之后

#player1 {box-shadow:() 5px;}

Answer 1

<强>更新

没有必要为box-shadow的{​​{1}}属性设置默认值，因为在加载页面时它将由JavaScript设置（这是你打算做的吗？） 。您可以尝试以下方法：

纯JavaScript

DEMO (RGB value is hard-coded)

#player1

然而，IE似乎并不支持$(window).ready(function(){ var sourceImage = document.getElementById("art"); var colorThief = new ColorThief(); var color = colorThief.getColor(sourceImage); document.getElementById('player1').style['boxShadow'] = '10px 10px 5px rgba('+ color[0] + ', ' + color[1] + ', ' + color[2] + ', 0.5)'; }); 。或者，我建议使用jQuery，您可以尝试以下方法：

的jQuery

DEMO (RGB value is hard-coded)

.style['boxShadow']

此代码段也适用于IE。