Podmíněné zobrazení barvy – CSS – Fórum – Programujte.com

Zdravim vsechny.

mam dotaz a doufam, ze mi s tim nekdo pomuze.

mam tabulku a v ni nejake ciselne hodnoty a potrebuji aby kdyz je ta hodnota zaporna tak mela jinou barvu.

to neni nic sloziteho, ale jedine co mohu tak je to ze to mohu zapsat nejak to polozky Style="" primo definici toho <td> jinam nemohu nic psat.

Vim jake ID ma tany td a to je vse, jelikoz je vse generovano aplikaci tak nemohu do niceho zasahnout a ani tam vlozit zadny kod krom css do lastnosti Style.

Dekuji za pomoc.

- uprav si aplikaci, aby pro zaporna cisla pridaval class
- nebo pouzij js, ktery projde kazde policko a prida pro zaporne cislo dodatecne class
- to js se da napsat i do css
- v css existuje neco jako nth-child, tr td:nth-child(5) {}, kdyz znas pozici toho td
https://developer.mozilla.org/…S/:nth-child

#2 peter
"- to js se da napsat i do css"

Prosím si zdroj.

#1 David
Projdeš si tabulku Javascriptem a u záporných hodnot změníš styl.

 Do css se to dava pres behaviour nebo nejak podobne. Ale to neni nutne, jestli tam muzes pripsat link na script.

function getTag(el, name) {return el.getElementsByTagName(name);}

table_all = getTag(document,'TABLE');
table = table_all[0]; // tabulka
tr_all = getTag(table,'TR'); // vsechny radky
td_all = getTag(tr_all[0],'TD'); // vsechny sloupce pro radek 0

+ par cyklu (i_end = tr_all.length)
+ podminka
td_all[i].className = td_all[i].innerHTML>0 ? 'kladne' : 'zaporne'; // zmeni class

Mozna by tam mohlo byt spis td_all[i].innerHTML*1>0, aby to pro jistotu prevedl zrovna na cislo.
 

#2 peter
Kdybych mohl zmenit aplikaci tak to neresim a to stejne kdyby slo pouzit javascript. proste jde o to ze nemohu do zdrojaku nic pridavat a jedine co je tak mohu pridavat polozky s definici css stylu primo do tagu td a to v predem definovanem poly kam vlozim jenom ciste css a nic vic.

to znamena ze pouze na danem tzd mohu neco nastavit a potrebuji predtim zjistit zda tem je zaporna nebo kladna hodnota.

jinak je to specialni programovani v CACHE a tam je to jeste jen jedna cast co je hotova a mohou se tam pouze pridavat css parametry.

napadlo me to obejit tim ze ukoncim dany tag a dodam nejake js, ale zarvalo to ze to proste nejde. je to tam osetrene.

#5 peter
jak jsem psal v dotazu tak tam mohu napsdat pouze css a nic vic. 

#2 peter
Pozici bunky TD na radku zanm ale nevim jakej je to radek TR, protoze je to generovane z DB a meni se to.

#3 weroro
tady je to co se vygeneruje a jedine co mohu zapsat je to co se vlozi mezi ty "" u tagu STYLE nic vic

<table>
  <tr>
   <th>naddpis</th>
   <th>nadpis 2</th>
  </tr>
  <tr>
    <td id="left145" style="">-1</td>
    <td id="left175" style="">2</td>
  </tr>
  <tr>
    <td id="left178" style="">11</td>
    <td id="left176" style="">25</td>
  </tr>
  <tr>
    <td id="left785" style="">45</td>
    <td id="left589" style="">-56</td>
  </tr>
</table>

https://css-tricks.com/forums/topic/what-is-a-htc-file/

https://www.interval.cz/clanky/prirazeni-skriptu-stylem-behavior-a-htc/

#someSelector1 {
behavior: url('js/file.htc'); /*pomoci htc*/
}
#someSelector2 { 
width:expression(document.body.clientWidth > 800? "800px": "auto" ); /*primy vstup js*/ 
}

file.htc
<component>
<attach event=“onmouseover“ onevent=“prebarvit(‚red‘)“>
<attach event=“onmouseout“ onevent=“prebarvit(‚yellow‘)“>
<script>
function prebarvit(barva)
{
element.style.backgroundColor = barva; // tady by stacilo zmenit na neco takoveho
element.style.className = element.innerHTML*1 > 0 ? 'barva1' : 'barva2'; // a na hover to pak bude obarvovat
}
</script>
</component> 

Udalost bych pouzil mozna onload nebo onDocumentReady, viz ten clanek interval.cz, skoro uplne dole.

Ten js by se dal pouzit ze stranky
https://www.hanselman.com/…ascript.aspx

    <style type="text/css">
     td.negative { color : red; }
    </style>
    <script language="JavaScript" type="text/javascript">
    <!--
    function MakeNegative() {
        TDs = document.getElementsByTagName('td');
        for (var i=0; i<TDs.length; i++) {
                var temp = TDs[i];
                if (temp.firstChild.nodeValue.indexOf('-') == 0) temp.className = "negative";
            }
    }
    //-->
    </script>

Mozna by se dalo pouzit formatovani pomoci parametru
http://rpbouman.blogspot.com/…matting.html

  <style type="text/css">
    
    /* right-align monetary amounts */
    td[data-monetary-amount] {
      text-align: right;
    }

    /* make the cells output their value */
    td[data-monetary-amount]:after {
      content: attr(data-monetary-amount);
    }

    /* make debit amounts show up in red */
    td[data-monetary-amount^="-"]:after {
      color: red;
    }
    
  </style>

S tim css selektorem jsem to bohuzel nenasel rozumne vysvetlene, jak to jde kombinovat. Z toho prikladu vyplyva, ze musis mit kontrukci 

<style>tag[param^="-"]{}</style>
<tag param="-xyz">abc</tag>

 'param' zacina znaky "-", pak mu dej cervenou barvu. jenze to znamena pridat neco k tagu. Nevim, zda, kdyby se pouzilo value nebo html nebo inner-html nebo neco tak, jestli by to take fungovalo.

Tak, na stackoverflow psali, ze to nejde, pry.
Nicmene, existuje neco jako 'content' a 'text'.

A jeste jednu stranku jsem nasel. Ale, tam, podle mne, maji pridany js, ktery umi ten css prelozit. Ale, treba to bude fungovat i bez toho.
https://discourse.wicg.io/…/629/16 ;

<h2>Text from attribute as innerHTML</h2>
<div id=text data-text="This is <strong>HTML</strong> text."></div>

<style>
  @element '#text' {
    eval('innerHTML = getAttribute("data-text")');
  }
</style>

<script src=http://elementqueries.com/EQCSS.js></script>

Otazkou zni, proc to googluji ja a ne ty? :)

#14 peter
nakonec se mi povedlo do stranky dostat vlastni css styl a tak jem to v nem napsal a ted to funguje diky moc vsem za pomoc.