jquery - 使用 JavaScript 动态伪元素 CSS

标签 jquery html css pseudo-element

是否可以动态设置伪元素的CSS?例如:

jQuery 动态样式化帮助容器

$('#help').css({
    "width" : windowWidth - xOffset,
    "height" : windowHeight - yOffset,
    "bottom" : -windowHeight,
    "left" : 200
});

jQuery 尝试设置帮助容器的内边框:

$('#help:before').css({
    "width" : windowWidth - xOffset,
    "height" : windowHeight - yOffset
});

上面的 CSS 文件

#help
{
    opacity: 0.9;
    filter:alpha(opacity=90);   
    -moz-opacity: 0.9;          
    z-index: 1000000;
    bottom: -550px;
    left: 400px;
    background-color: #808080;
    border: 5px dashed #494949;
    -webkit-border-radius: 20px 20px 20px 20px;
    -moz-border-radius: 20px 20px 20px 20px;
    border-radius: 20px 20px 20px 20px;        
}
#help:before 
{
    border: 5px solid white;
    content: '';
    position: absolute;
    -webkit-border-radius: 20px 20px 20px 20px;
    -moz-border-radius: 20px 20px 20px 20px;
    border-radius: 20px 20px 20px 20px;          
}

最佳答案

你不能直接通过 jQuery 来完成。

看这个问题:Setting CSS pseudo-class rules from JavaScript

@Box9's answer可能是您实际应该使用的那个:

I threw together a small library for this since I do think there are valid use cases for manipulating stylesheets in JS.

关于jquery - 使用 JavaScript 动态伪元素 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7164709/

相关文章:

html - 两个 div 元素应排成一行

android - 生成后模拟器中的图像 "missing"

css - 关于不包含 class 或 id 属性的 css 选择器的 selenium 测试

javascript - 页面跳起来而不是向上滚动

javascript - Chrome 扩展程序 : How to refresh a tab based on its title?

javascript - 在运行时创建 Bootstrap Modal 加载 Javascript

HTML布局问题

css - 从任意 SVG 文件制作 Sprite

Jquery 在点击滚动条时显示 div

javascript按钮按键在第n次点击事件中被触发n次