Question

我正在努力拥有一个无限运行的功能。它获得随机色调，然后将其插入到color属性中。这是我的代码：

<script>    
  function colorMe(){
    var hue = Math.floor((Math.random() * 359) + 1);
    document.getElementById("hie").style.color = hsl(hue, 75%, 50%);
    colorMe();
  }
  colorMe();
</script>
<p id="hie">I don't know what color this will be!</p>

提前致谢。

Answer 1

您必须将hsl部分放在引号中。

document.getElementById("hie").style.color = "hsl("+hue+", 75%, 50%)";

Answer 2

有几件事 - 首先，您要从colorMe函数中调用colorMe。你可能不想这样做。其次是hsl不作为javascript方法存在 - 它是一个css函数。尝试将颜色设置为等于包含更新的hsl颜色的字符串，如下所示：http://jsfiddle.net/99h5s0L6/

function colorMe() {
    var hue = Math.floor((Math.random() * 359) + 1);
    document.getElementById("hie").style.color = "hsl(" + hue + ", 75%, 50%)";
}
colorMe();

Answer 3

我不确定，但我个人会改用filter: hue-rotate(30deg)。

我不确定IE支持，但它支持FF和Chrome（通过供应商前缀）。例如：

-webkit-filter: hue-rotate(30deg);
filter: hue-rotate(30deg);

只需随机改变旋转度并相应地设置。

编辑：

使用jQuery：

$('#hie').css("-webkit-filter","hue-rotate(" + hue + "deg)")
$('#hie').css("filter","hue-rotate(" + hue + "deg)")

随机色调文本颜色不起作用

3 个答案: