將隨機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的邊框頂部顏色

回答

相關問題