我如何循环遍历所有元素,包括伪元素？我知道我可以使用它getComputedStyle(element,pseudoEl)来获取它的内容,但是我一直无法找到一种方法来获取页面上的所有伪元素,以便我可以使用前面提到的函数来获取它们的内容/样式.似乎是一个简单的问题,但一直无法找到任何解决方案.
我想选择伪元素 :after
这是我的css:
show-more:after
{
content : (" > ");
}
JQuery 码
$(function(){
$('.show-more:after').click(function() {
alert("Yes");
});
});
我需要在Jquery UI datepicker的某些日期显示自定义文本,更准确地说,为某些日期呈现特定价格.我的想法是使用beforeShowDay在这些日期的标题中附加特定价格,然后在beforeShow中检查每个td并将标题的文本放入单元格.例:
var m, d, y, checkDate, specificPrice = '';
var specificPrices = {"2013-3-8":"300 EUR", "2013-2-26":"263 EUR"}
$('#my-datepicker').datepicker({
beforeShowDay: function checkAvailable(date) {
m = date.getMonth();
d = date.getDate();
y = date.getFullYear();
checkDate = y + '-' + (m+1) + '-' + d;
if(specificPrices[checkDate]){
specificPrice = specificPrices[checkDate];
}else{
specificPrice = '';
}
return [true, "", specificPrice];
},
beforeShow: function(elem, inst){
$('table.ui-datepicker-calendar tbody td', inst.dpDiv).each(function(){
var calendarPrice = $(this).attr('title');
if(calendarPrice != undefined){
$(this).find('a').append('<span class="calendar-price">' + calendarPrice + '<span>');
} …我已经定义了一个类似的CSS
.slidingTag li:after {
content: '';
z-index: 3;
height: 6px;
}
我想从JS动态更改height属性.我可以使用该物业
window.getComputedStyle(document.querySelector('.slidingTag'), 'li:after').getPropertyValue('height')
但我不知道如何更改height属性.我尝试使用,setProperty但似乎没有这样的函数可用于伪类.任何想法让我知道.
我可以使用jquery来控制自定义webkit滚动条的外观吗？我很好奇,因为我想改变::-webkit-scrollbar-track-piece悬停时的背景颜色::-webkit-scrollbar-thumb.也许有一种方法可以用CSS做到这一点.我愿意接受任何解决方案!谢谢!
我正在将一个:after伪元素应用于显示我的媒体查询断点名称的正文,如下所示:
body::after {
content: 'medium';
display: none;
}
这样做的原因可以在这里找到:http://adactio.com/journal/5429/
我想获得:after在IE8 中使用javascript 的内容值.
这是我为其他浏览器做的方式:
var breakpoint = window.getComputedStyle(document.body, ':after').getPropertyValue('content');
但IE8不支持getComputedStyle(),我知道它支持currentStyle,但经过一些尝试后我无法正确使用它.
这是我尝试没有成功的事情:
var breakpoint = document.body.currentStyle.getPropertyValue('content');
有人知道怎么做吗？
编辑: 在BoltClock的笔记之后我现在已经将我的css改为此(一个半冒号):
body:after {
content: 'medium';
display: none;
}
在使用两个之前,内容甚至没有出现在IE8中,所以它没有任何回报.不幸的是我仍然无法让IE8返回内容.
我在尝试这个:
if (style = document.body.currentStyle) {
for (var prop in style) {
if (prop === 'content') {
alert(prop);
}
}
}
我什么都没得到,但是如果我换'content'了一些其他的财产'backgroundColor'就会发出警告.所以我想即使msdn将内容列为currentStyle http://msdn.microsoft.com/en-us/library/ie/ms535231%28v=vs.85%29.aspx的可用属性之一,它也不会实际上是回归它,除非我做错了什么.
我想使用jQuery 在" " 上设置CSS counter-increment属性.demo:before.
问题是jQuery无法访问伪元素.另一个SO答案(我现在似乎无法找到)建议设置数据属性,然后在CSS中使用该值,但这也不起作用.这是可以实现的吗？
简化示例:http://jsfiddle.net/4h7hk8td/
HTML:
<ul class="demo">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
JS:
// 1) User Sets Unit Size
var myUnit = 100;
// 2) Unit size is saved via data attribute
$('.demo li').attr('data-unit', myUnit);
CSS:
.demo {
counter-reset: list;
}
.demo li:before {
/* 3) CSS gets data attribute and applies as the increment. Not working :( */
counter-increment: list attr(data-unit);
content: counter(list);
}
我需要为我的元素动态创建我的CSS样式.但是,我需要:在CSS之后我听说你不能在jQuery中修改它.
这是真的？有没有办法解决？
我想使用 CSS 变量来存储字体，以防用户没有安装指定的字体。
例子：
:root {
--common-font: Comic Sans MS;
}
.header1 {
font-family: CoolFont1, var(--common-font);
}
如果我在字体名称中添加对变量的引用，旧浏览器会中断吗？