Dynamically apply ::after style to a component?

I want to add a background image with transparency to a component which is created in runtime. Using this trick: http://css-tricks.com/snippets/css/transparent-background-images/, i can add the background image programatically to my component. As I understand, the "style" property creates only normal css style, not the ::after style for that div. Is there any trick that i can add div::after style to my component.

Thanks

Comments

  • You're right that you can't add a pseudo rule in the style attribute (afaik). If you need to dynamically specify the background image, it's probably simpler to apply the style to a DOM node rather than using the pseudo element. You could do it by injecting a node into the DOM with the CSS definition but you're not saving yourself anything as you've added a node in both cases.

    Here's a quick kind to do the former.

    http://jsfiddle.net/ryanjduffy/j23ES/
  • I'm in the air and can't try this, but does

    .applyStyle("::after", ...);

    not work?
  • edited May 2014
    AFAIK, pseudoelements are not accesible from JS, you'll probably end up with a node attribute like this:

    [htmlContent]
Sign In or Register to comment.