gpt4 book ai didi

javascript - HSL 随机颜色将其应用于函数

转载 作者:行者123 更新时间:2023-11-28 10:56:10 24 4
gpt4 key购买 nike

我真的是 jquery 的新手,我正在尝试使用它,以便每次为单词闪烁生成的颜色总是不同的颜色,但无法弄清楚如何这样做。请查看下面我的代码或查看 jsfiddle。

http://jsfiddle.net/schan01/2d8Rr/

<!doctype html>
<html>
<head>
<style>

html{
height:100%;
overflow:hidden;
}

p{
font-family: "Helvetica";
font-size: 10px;
float:left;
margin:10px;

}


.box {
width: 10px;
height: 10px;
float:left;
margin:10px;
}



.hovered{
color: blue;

-webkit-animation-name: blinker;
-webkit-animation-duration: 1s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;

-moz-animation-name: blinker;
-moz-animation-duration: 1s;
-moz-animation-timing-function: linear;
-moz-animation-iteration-count: infinite;

animation-name: blinker;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite;

}

@-moz-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}

@-webkit-keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}

@keyframes blinker {
0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }
}




</style>

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>

var g = 0;


$(function() {

for(var i=0; i<1000; i++){
$("body").append("<p>blink</p>");
}

$("p").hover(function() {
//hovered on
$(this).addClass("hovered")({
"color":"hsl(" + g + ",100%,50%)"
});

});

});

</script>
</head>

<body>

</body>

</html>

感谢所提供的任何帮助或建议。谢谢。

最佳答案

您错过了 .css() 的电话在 .addClass()

之后
$(this).addClass("hovered").css({
"color": "hsl(" + g + ",100%,50%)"
});

fiddle

关于javascript - HSL 随机颜色将其应用于函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22596997/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com