目标 :before 和 :after 伪元素与 jQuery
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5814810/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Target :before and :after pseudo-elements with jQuery
提问by Erik Veland
Possible Duplicate:
Manipulating CSS pseudo-elements using JQuery
可能的重复：
使用 JQuery 操作 CSS 伪元素
On pageload I want the :before and :after elements on a class to appear. I've set the .lifted:before and .lifted:after to be opacity:0 in the css. Within document ready I have:
在页面加载时，我希望类上的 :before 和 :after 元素出现。我已经在 css 中将 .lifted:before 和 .lifted:after 设置为 opacity:0 。在准备好的文件中，我有：
$(".lifted:before").css("opacity", "1");
$(".lifted:after").css("opacity", "1");
This doesn't work. And the .after jQuery manipulator is only made for inserting content as far as I can tell.
这不起作用。据我所知，.after jQuery 操纵器仅用于插入内容。
Is there any way I can manipulate the css of these pseudo-elements using jQuery?
有什么方法可以使用 jQuery 操作这些伪元素的 css？
回答by Erik Veland
Decided to go with the solution of adding a class on load to the element and then manipulating it in the css.
决定采用在加载时向元素添加类然后在 css 中对其进行操作的解决方案。
$(".lifted").addClass("on");
CSS
CSS
.lifted.on:before,
.lifted.on:after {
opacity: 1;
-webkit-transition: opacity 1200ms cubic-bezier(0.25, 0.1, 0.25, 1);
-o-transition: opacity 1200ms cubic-bezier(0.25, 0.1, 0.25, 1);
transition: opacity 1200ms cubic-bezier(0.25, 0.1, 0.25, 1);
-moz-transition: none /* Removed until FF4 hang bug is fixed */
