僞撥動類：下課

給定一個按鈕僞撥動類：下課

<button href="#" class="search no-style search-active" style="display: inline-block;"> 
<div class="pointer" style="display:none">::after</div> 
</button>

觸發時，僞:after類需要有一個類search-active切換，用於設置按鈕

.primary .search:after, 
.primary .search[data-search="disabled"]:after { 
    color: #fff; 
    content: "\E8B6"; 
    font-family: "Material Icons"; 
    position: absolute; 
    top: -25px; 
    transition: color .3s; 
    font-size: 26px; 
    margin-left: -10px; 
} 

//THIS NEEDS TO BE APPLIED TO THE :after PSEUDO CLASS TO SET THE BACKGROUND COLOR OF THE BUTTON 
.search-active { 
    background-color: purple; 
    padding: 12px 33px 19px 35px; 
    margin: 0px -30px; 
}

背景顏色我有類似的jQuery工作的另一個按鈕，但這似乎不適用於此特定實例：

$(".search").on("click", function() { 
    $(this).toggleClass('search-active'); 
});

的jsfiddle：https://jsfiddle.net/xk9hx9j9/2/

來源

2016-05-16 user3438917

我想你應該只需更換'.search-active'與樣式表中的'.primary .search.search-active：after'。 https://jsfiddle.net/xk9hx9j9/4/ – Blazemonger

@Blazemonger - '：after'類是什麼圖標，然後我需要應用點擊背景顏色使用我創建的活動類。我不能只在默認情況下設置背景顏色，因爲這不是我想要實現的。 – user3438917

您可能會發現此信息：http://stackoverflow.com/questions/5041494/selecting-and-manipulating-css-pseudo-elements-such-as-before-and-after-usin – SimianAngel

這是你的評論刪除此行「//這需要應用到：after僞類設置按鈕的背景顏色」

來源

2016-05-16 21:50:44

該評論不影響碼。我把評論放在解釋我需要發生的事情上。 – user3438917

/*這是你如何評論CSS * /刪除你的評論，然後再試一次 –

我知道如何評論CSS，我一直在JS工作，它使用'/ /'作爲註釋。這並不影響這個CSS的渲染。 – user3438917

僞撥動類：下課

回答

相關問題