使用 JavaScript 动态伪元素 CSS

2024-02-10

是否可以动态设置伪元素的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 来完成此操作。

看看这个问题:从 JavaScript 设置 CSS 伪类规则 https://stackoverflow.com/questions/311052/setting-css-pseudo-class-rules-from-javascript

@Box9的回答 https://stackoverflow.com/questions/311052/setting-css-pseudo-class-rules-from-javascript/5077782#5077782可能是您实际应该使用的:

我拼凑了一个小型图书馆 https://github.com/Box9/jss因为我确实认为那里 是在 JS 中操作样式表的有效用例。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 JavaScript 动态伪元素 CSS 的相关文章

  • 如何从 Python 返回 JSON 值?

    我从如下所示的 jQuery 文件发送 ajax 请求 该请求需要 JSON 格式的响应 jQuery ajax url Control getImageDetails file id currentId type GET contentT
  • 内联 div 元素

    我试图将 div 元素放在一起 问题是 即使有足够的空间让两个元素位于同一行 新的 div 也会将自身移动到下一行 如果没有足够的空间 我只需要另一个 div 去到下一行 有人知道怎么做这个吗 将 CSS 显示样式设置为display in
  • 如何在chart.js中使用JSON数据?

    您好 我一直在尝试使用 MYSQL 数据库中的数据 并使用它们通过 Chart js 创建图形图表 我将数据编码为 JSON 数据 通过 php 文件名 data1 php 现在我需要使用 Jquery 或 javascript 将这些 J
  • 如何使用 HTML 元素阻止 THREE.js 光线投射?

    我希望页面上的 HTML 元素阻止 THREE js 光线投射 我该如何执行此操作 我遇到的问题是 当用户单击打开的 DIV 元素时 光线投射会检索场景中的对象 它会检索 DIV 后面的对象 我不想在 DIV 打开时禁用光线投射 我纯粹希望
  • 禁用小写字符下划线:g q p j y?

    有时您不希望下划线盲目地穿过带下划线的页面标题 有没有办法自动优雅地禁用强调对于某些小写字符 在这些情况下 最好不要在这些小写字母下划线 例如 g q p j y CSS h1 text decoration underline PAGE
  • youtube 将视频嵌入为带有边框半径的 iframe

    我遇到了一个我完全不明白的问题 我有一个带有 YouTube 视频 iframe 的网站 想通过 CSS 来圆化边框 在http www wunschpreisdeal de empfehlung winterreifen profilti
  • 从 iframe 关闭父弹出窗口

    在domain1 com 上 我有一个链接 可以打开domain2 com 的弹出窗口 弹出窗口中有一个 iframe 也托管在 domain2 com 上 在 iframe 中 我试图关闭弹出窗口 我似乎对如何做到这一点感到困惑 在 if
  • 使用 CSS 等高列

    我想对我的 CSS 表使用百分比 不幸的是 它对我不起作用 这段代码有什么问题 我应该使用 flexbox 而不是 table 吗 我想使用表格 因为我想要相同高度的列 ul list style none margin 0 display
  • 获取 HTML 代码的结构

    我正在使用 BeautifulSoup4 我很好奇是否有一个函数可以返回 HTML 代码的结构 有序标签 这是一个例子 h1 Simple example h1 p This is a simple example of html page
  • 在 Chrome 上使用 html5 显示垂直视频

    我正在构建一个简单的page http jsfiddle net JVZGZ 使用 html5 视频标签显示从我的 iPhone 上传的视频 如果您使用 chrome 观看它 您可能会看到该视频是水平呈现的 尽管它不是水平呈现的 尝试下载它
  • 我可以阻止history.popstate在初始页面加载时触发吗?

    我正在开发一个通过 AJAX 提供内容的网站 如果您单击菜单中的某个项目 内容 div 会更新为 get回应 没什么花哨的 我正在实施history pushState允许使用浏览器的后退 前进按钮进行导航 我有以下内容可以在历史导航上加载
  • 对于 SEO 而言,.html 扩展名是否比 .php 和 .aspx 更好?

    对于 SEO 而言 html 扩展名是否比 php 和 aspx 更好 或者少扩展名的 url 比全部更好 该扩展对排名和所有 SEO 影响不大 您页面的扩展名可能不一定表明内容是如何生成的 PHP 或 ASPX 虽然通常具有动态内容 但始
  • CSS 过渡或动画从顶部向上滑动:100% 到底部:0

    内部 div 的高度可变 具体取决于内部文本的长度 该高度始终比外部 div 短 我希望当外部 div 悬停时 内部覆盖 div 从 top 100 向上滑动到bottom 0 我下面的 CSS 代码没有产生我想要的向上滑动效果 它只是在外
  • 如何使用 Soundcloud api 将流传输到 html5 音频播放器中?

    我刚刚开始学习 javascript 作为我的第一次尝试 我想创建自定义音频播放器 它使用 soundcloud 的 api 作为音乐源 到目前为止 这就是我的设置
  • 扩展html表格突出显示行和列并使当前单元格具有不同的颜色

    我找到了用鼠标悬停时突出显示行和列的示例 https stackoverflow com a 28312853 139698 https stackoverflow com a 28312853 139698 如何使鼠标悬停的一个单元格变为
  • 交换两个文本框的值

    我有两个文本框值 var pickup txt pickup var destination txt destination 我想交换这两个值 如下所示 pickup val destination val destination val
  • 如何使用 Ajax 在 Flask 中发布按钮值而不刷新页面?

    我有一个问题 当我单击 Flask 应用程序中的按钮时 我想避免重新加载 我知道有 Ajax 解决方案 但我想知道如何将我的按钮链接到 ajax 函数以发布按钮值并运行链接到其值的 python 函数 这是我的 html 按钮 div di
  • 带有延迟的 jQuery 切换类只能运行一次

    当涉及到 jQuery 匿名函数和延迟时 我显然错过了一些基本的东西 下面的代码每次页面加载只能运行一次 它将添加该类 然后在 1 秒后将其删除 如果我再次单击 它将添加该类 但在页面持续时间内永远不会删除该类 除非我重新加载页面 var
  • 如何在输入时格式化 contenteditable div?

    我正在尝试编写一个函数 允许 contenteditable div 在用户输入 div 时执行一些自动格式化 到目前为止我只能让它在 IE 中运行 有人可以帮助我吗 function formatOnKeyUp if window get
  • Fancybox修改。如何修改 fancybox 以停止在每个画廊的最后一项? (画廊 1 画廊 2 等)[重复]

    这个问题在这里已经有答案了 我正在为我的照片库使用 fancybox 插件 我有多个包含更多项目 照片 的画廊 我想知道如何在点击每个画廊的最后一个项目时停止幻灯片放映 我的 fancybox js 没有被修改 谢谢 您需要添加该选项loo

随机推荐

  • 将 int 转换为 ASCII 字符

    I have int i 6 而且我要 char c 6 通过转换 有什么简单的方法可以推荐一下吗 EDIT 我还需要生成一个随机数 并转换为字符 然后添加一个 txt 并在 ifstream 中访问它 直接的方法 char digits
  • JavaScript Promises - 拒绝与抛出

    我读过几篇关于这个主题的文章 但我仍然不清楚两者之间是否有区别Promise reject与抛出错误 例如 使用 Promise reject return asyncIsPermitted then function result if
  • 结合UIView动画块和OpenGL ES渲染

    我正在开发一款 iP 游戏 并且使用 UIKit 和 OpenGL ES 2 0 UIKit 元素在 OpenGL 视图上渲染并占据大量 任意 屏幕空间 我必须承认苹果做得非常出色 游戏的帧率始终保持在60 FPS 为了得出这个结论 我做了
  • php自定义异常

    我想知道如何编写自定义异常处理程序 这样我就可以做类似的事情 throw new dbException sql message 并让它输出 您的查询有误 消息 消息 查询 sql 这里 行 行异常被抛出 文件 抛出文件异常 但我也想捕获例
  • 如何在您的应用程序中获取 Elastic Beanstalk 应用程序版本?

    我们希望能够在 PHP 代码中检索 elastic beanstalk 应用程序版本 我没有看到 EB 在任何服务器配置文件中将其传递给我们 我觉得这很奇怪 还有其他人知道我们如何才能得到这个吗 至少对于 Docker 容器 您可以使用存储
  • Python:在 CSV 中得到 \xa0 而不是空格,无法删除或转换

    我有一个与 python 中的编码问题相关的问题 IPython笔记本 由于此类问题非常常见且简单 但我仍然无法真正解决它 我有一个CSV http www montefiore ulg ac be glouppe 2012 2013 ch
  • Sails js - 创建资产的副本

    我们正在考虑将我们的项目移植到 Sails js 我们的静态资产非常大 超过 3 GB 因此 这造成了严重的限制 因为它使我们的应用程序的大小增加了一倍 我们可以修改 Sails js 以防止这种默认行为吗 或者有人可以推荐其他框架吗 Sa
  • 使用 pry 时立即在 Rails 控制台中同时评估多行代码?

    假设我们有pry安装好后 打开rails控制台 然后运行 times 1 5 10 30 72 sample 1 0 nums 1 72 num sample nums sample times 计算在第 2 行之后停止 因为第二行的输出超
  • 如何让Android系统对所有apk强制使用LANDSCAPE?

    为了实现这一点 我在android系统 v4 04 中进行了三种修改 它们是 1 WindowsManagerService java 修改了getOrientationFromWindowsLocked 2 Activity java 修
  • Angular2 rxjs - switchmap 捕获错误

    我希望能够处理调用时出错的任何错误this authService refreshToken 可以在 switchmap 块内处理错误吗 或者在这种情况下我该如何处理错误 post3 endpoint string body string
  • Android 中的“-journal”SQLite 数据库是什么?

    在我的andoid应用程序的数据库目录 data data com me myApp databases 中 对于我创建的每个sqlite数据库 都有一个同名的相应数据库 名称后附加 journal 例如 myDatabase myData
  • 在 web.config 中设置多个 SMTP 设置?

    我正在构建一个应用程序 需要在发送电子邮件时动态 编程地了解并使用不同的 SMTP 设置 我习惯使用 system net mailSettings 方法 但据我了解 这种方法一次只允许一个 SMTP 连接定义 由 SmtpClient 使
  • 灵活或居中页面 HTML CSS

    我必须使用灵活或居中的页面设计 即使用户屏幕分辨率为 800 600 也能正常工作 当我缩小页面时 元素会移动并改变它们的位置 灵活页面或居中页面正常吗 如果不是应该怎样 页面的 CSS 代码 body margin left auto m
  • 以编程方式为 ViewController 创建选项卡栏

    我一直在考虑以编程方式向我的视图控制器添加一个选项卡栏 因为有一个滚动视图 如果它不在我的视图中间 我就无法将其放置在上面 我对如何添加它有点困惑 是否需要在我的ViewDidLoad方法或我的AppDelegate 如果我有 UITabB
  • 如何从包含为 jar 的不同项目模块 @Inject 对象

    我在多模块 Maven 项目中使用 Vaadin CDI 其中包含一个通用类 如接口 抽象类等 所需的模块 我的问题是 我无法 Inject带注释的类 UIScoped像往常一样 它被放置在core模块到另一个 我还在得到不满意解决异常 S
  • 所有可能的词

    我想使用 a z 创建所有可能的 5 个字母单词 请建议任何好的且快速的算法 我尝试过创建一个 它看起来像这样 byte allchar new byte a b c d e f g h i j k l m n o p q r s t u
  • 如何在 iPad 版 Safari 中使用 jQuery 识别触摸事件?是否可以?

    是否可以使用 jQuery 识别 iPad Safari 浏览器上的触摸事件 我在 Web 应用程序中使用了 mouseOver 和 mouseOut 事件 由于没有 mouseOut 和 mouseMove 等事件 iPad 的 Safa
  • Django 无法从 django.contrib.auth.views 导入登录信息

    我尝试为我的页面构建登录功能 要按如下方式编辑 urls py 它会不断打印 无法从 django contrib auth views 导入名称 login 我该如何处理这个问题 from django contrib auth view
  • C++:0.和0.0之间的区别?

    我很清楚之间的区别0 and 0 0 整数和双精度 但这之间有什么区别吗0 and 0 0 请注意 预先非常感谢 Axel 没有区别 两个文字都是双精度的 来自 C 语法 fractional constant digit sequence
  • 使用 JavaScript 动态伪元素 CSS

    是否可以动态设置伪元素的CSS 例如 jQuery 动态样式帮助容器 help css width windowWidth xOffset height windowHeight yOffset bottom windowHeight le