伪拨动类：下课

给定一个按钮伪拨动类：下课

<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

伪拨动类：下课

回答

相关问题