Ocasta Eshu
Ocasta Eshu

Reputation: 851

HTML - font color determined by value

How can one set a font color to be determined by the value of the text enclosed using HTML and/or CSS. The enclosed text is constrained to integer values. The desired effect is similar to a heat map.

A possible solution might look like this:

<FONT COLOR=function> 1 </FONT>
<FONT COLOR=function> 100 </FONT>

where "function" would resolve to:

<FONT COLOR="red"> 1 </FONT>
<FONT COLOR="green"> 100 </FONT>

Upvotes: 1

Views: 1196

Answers (1)

Tyler Durden
Tyler Durden

Reputation: 1026

Using jQuery something like the following may suit your needs (based on what I think it is you tried to explain):

$('font').each(function() {
    var value = $(this).text();
    var colorVal;
    // determine your color
    $(this).attr('color', colorVal);
});

But I would recommend using classes or style manipulation as the HTML you are proposing to use has been deprecated.

Upvotes: 3

Related Questions