将随机css颜色更改为一个DIV的背景和另一个DIV的边框顶部颜色

我想随机（选定列表的）改变我已完成并且工作良好的标题背景的颜色，使用这个JS：将随机css颜色更改为一个DIV的背景和另一个DIV的边框顶部颜色

var bgcolorlist=new Array("#ef5c20", "#a7dbca", "#c5e53f", "#ffad14") 

$(".cbp-hsinner").css("background-color",bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]);

，但我想同样的随机颜色应用到这个的 '边框顶部颜色'：

.cbp-hsmenu > li.cbp-hsitem-open > a:after { 
top: 100%; 
border: solid transparent; 
content: " "; 
height: 0; 
width: 0; 
position: absolute; 
pointer-events: none; 
border-color: transparent; 
border-top-color: #ef5c20; 
border-width: 10px; 
left: 50%; 
margin-left: -10px; 
}

HTML：

<nav class="cbp-hsmenu-wrapper" id="cbp-hsmenu-wrapper"> 




       <div class="cbp-hsinner"> 

       <div class="site-header__logo-alt"><a href="http://helloarchie.blue/"><img width="145" alt="Hello Archie" src="<?php echo theme_url('/img/HA-LOGO3.png'); ?>" /></a></div> 

        <ul class="cbp-hsmenu"> 

        <li> 
          <a href="http://helloarchie.blue">Home</a> 
         </li> 



         <li> 
          <a href="#">Categories</a> 
          <ul class="cbp-hssubmenu"> 
           <li><a href="http://helloarchie.blue/category/personal/"><span>Personal</span></a></li> 
          <li><a href="http://helloarchie.blue/category/monthly-updates/"><span>Monthly Updates</span></a></li> 
           <li><a href="http://helloarchie.blue/category/informative/"><span>Informative</span></a></li> 
           <li><a href="http://helloarchie.blue/category/reviews/"><span>Reviews</span></a></li> 
          <li><a href="http://helloarchie.blue/category/guides/"><span>Guides</span></a></li> 
          </ul> 
         </li> 

         <li> 
          <a href="http://helloarchie.blue/about">About</a> 
         </li> 

         <li> 
          <a href="#">Elsewhere</a> 
          <ul class="cbp-hssubmenu"> 
           <li><a href="http://kaye.at/"><span>Portfolio</span></a></li> 
           <li><a href="http://kaye.at/baby/"><span>The Baby Project</span></a></li> 

          </ul> 
         </li> 

        </ul> 
       </div> 
      </nav>

标签这里经过

这可能吗？

来源

2014-11-21 Kaye Huett

[Access the css“：after”selector with jQuery]（http://stackoverflow.com/questions/17788990/access-the-css-after-selector-with-jquery） – Markai 2014-11-21 11:54:21

什么是相关的HTML ？ – 2014-11-21 12:00:33

对不起，用HTML更新。 – 2014-11-21 12:07:25

创建一个颜色的变量，然后将其应用于这两个CSS规则。

var bgcolorlist=new Array("#ef5c20", "#a7dbca", "#c5e53f", "#ffad14"); 
var rgb = bgcolorlist[Math.floor(Math.random()*bgcolorlist.length)]; 
$(".cbp-hsinner").css("background-color",rgb);

这样你只拉动了随机颜色一次，把它应用到你想要的这两个地方。除此之外，没有办法将一个元素的直接设置为CSS中其他元素的background-color。由于您无法访问：直接在JS之后，您将需要使用this link的其中一项技术以您想要的方式添加CSS。

来源

2014-11-21 14:00:24 CaldwellYSR

将随机css颜色更改为一个DIV的背景和另一个DIV的边框顶部颜色

回答

相关问题