JQuery随机背景颜色和颜色,2 div

前端之家收集整理的这篇文章主要介绍了JQuery随机背景颜色和颜色,2 div前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我期待创建一个Jquery脚本,它将从10的列表中随机选择一种颜色,然后将其作为背景颜色应用于一个div,以及h1标签的颜色.

到目前为止,我有这个随机颜色:

$(document).ready(function() { var hue = 'rgb(' + (Math.floor((256-199)*Math.random()) + 200) + ','
                 + (Math.floor((256-199)*Math.random()) + 200) + ','
                 + (Math.floor((256-199)*Math.random()) + 200) + ')';
$('#controls-wrapper').css("background-color",hue);
$('h1').css("color",hue);});@H_403_5@ 
 

但是如何从10种颜色的列表中随机选择呢?
我找到了这个,但不知道如何将它应用于bg color div和h1标签.

$("#controls-wrapper").each(function(){ 
var colors = ["#CCCCCC","#333333","#990099"]; 
var rand = Math.floor(Math.random()*colors.length); 
$(this).css("background-color",colors[rand]);});@H_403_5@

解决方法

我想你想要完成的是:

假设您有一个这样的HTML页面

<html>
<body>
  <h1>Hello World!</h1>
  <div id="controls-wrapper>some text</div>
</body>

$(document).ready(function(){
  var colors = ["#CCCCCC","#990099"];                
  var rand = Math.floor(Math.random()*colors.length);           
  $('#controls-wrapper').css("background-color",colors[rand]);
  $('h1').css("color",colors[rand]);
});@H_403_5@ 
 

创建颜色数组后,您将获得与颜色索引对应的随机数.

现在您有一个随机索引,您可以使用它来设置对象的背景颜色或文本颜色.

如果您希望每种颜色都不同,那么您只需要打电话

rand = Math.floor(Math.random()*colors.length);@H_403_5@ 
 

再次设置下一个元素的颜色之前.

最后通过调用$(‘h1’).css(“color”,colors [rand]);你将在页面上的所有H1元素上设置颜色,你希望它在H1上特定设置ID或类值,然后使用$(‘h1.myclass’).css(“color”,colors [rand] ); OR $(‘#ID_for_my_H1’).css(“color”,colors [rand]);

原文链接:https://www.f2er.com/jquery/181234.html

猜你在找的jQuery相关文章