Dynamic CSS attribute

Question

I have the next two elements on an HTML file:

<a id="a1" href="?cssfile=css-folder/015/styles.css">Style number 015</a>
<div id="a1Preview"></div>

The first one (anchor) is a reference to a CSS that will be loaded dynamically by the page. The second one (div) pretends to be a preview (thumbnail) of the style sheet.

THE PROBLEM IS I need a way to set the div background dynamically from the CSS, something like:

#a1Preview
{
    background: url(css-folder/{"015" extracted from the <a> element}/preview.png);
}

Is this possible? Any ideas? Of course the HTML is untouchable. I can only change the CSS.

Thanks in advance.

Unfortunately, it's not possible with pure CSS. You're going to have to fall back to scripting for this, assuming you can use a script. — BoltClock
– BoltClock, Commented Jan 10, 2012 at 18:05
As far as I know it's not possible to trigger script from CSS, am I right? I can only work on the CSS file. Any chance to do it from there? — David Díaz
– David Díaz, Commented Jan 10, 2012 at 18:08

megubyte · Accepted Answer · 2012-01-10 18:04:54Z

1

You could use jQuery to change the css content dynamically. jQuery is a extension to javascript. From there you could then use the system you use to skin, but generally to extract href attributes from tags and change CSS, you can use such a thing.

answered Jan 10, 2012 at 18:04

megubyte

1,5899 silver badges15 bronze badges

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

2 Comments

David Díaz Over a year ago

Is jQuery available in any form for my CSS file? I can only work on the CSS file.

megubyte Over a year ago

If you can't touch the CSS file and you are working on a project, then maybe ask the developer(s) to implement a system with this library, overall their code may be minimised or they may have a better system using jQuery, but as far as I can see-- jQuery is the only way (not unless you want to make a style for each item, which seems the longer way round)

Collectives™ on Stack Overflow

Dynamic CSS attribute

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related