jQuery and CSS :before

Question

I'd like to use both the CSS :before pseudoclass and the jQuery .before() method to generate the same content (a <li> element) on a page for maximum browser compatibility (ie, both IE 6-7 AND other browsers with JavaScript disabled). Is this possible? Which will override the other?

:before is a pseudo-element.

BoltClock
– BoltClock

2011-06-19 21:21:17 +00:00
Commented Jun 19, 2011 at 21:21 — BoltClock
– BoltClock, Commented Jun 19, 2011 at 21:21

kinakuta · Accepted Answer · 2011-06-13 22:19:43Z

3

Add a class to the element (say, class="no-js") and remove it with javascript/jquery. Then style that class for the no-javascript case, then if, the user doesn't have javascript, that element will still have the style desired. Then, of course, if javascript is enabled, once you remove the class you can go ahead and do whatever you wish with javascript.

answered Jun 13, 2011 at 22:19

kinakuta

9,0371 gold badge41 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

cwhelms · Accepted Answer · 2011-06-13 22:23:37Z

1

You could also use the <noscript> tag around the css that has the :before on it. Just make sure it's css on the page and not linked.

answered Jun 13, 2011 at 22:23

cwhelms

1,7813 gold badges12 silver badges14 bronze badges

Collectives™ on Stack Overflow

jQuery and CSS :before

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related