BLUE <element> on se, jonka väriä ja taustaväriä on muutettu. class= "Tcol" on AINA käytettävä elementtiin, joka sisältää arvon ! Teksti on sallittu, mutta täytyy seurata arvoa ! |
Ajanjakso jännerakenteessa. | |
13.4°C |
<span style= "display: inline-block; width: 120px; text-align: center; border: 1px solid black;"> <span class= "Tcol" style= "font-size: 28px; font-weight: bold;">13.4°C</span> </span> |
Aiempi "bare bones" arvoon täytyy olla vähintään <span> asetettu. | |
-10.9 |
<td style= "text-align: center;"> <span class= "Tcol">-10.9</span> </td> |
Monivälinen rakenne - HUOMAA: Dynaamisen (ajax) sisällön kanssa voi kestää enintään 1 sekunti ennen kuin värimuutoksia tehdään. | 8.6 °C klo 10:52 | Katso alta html-koodi ... |
<td style= "text-align: center" > <span class="ajax Tcol" id="tempTH">8.6</span><span class="lowerfont"> °C klo </span><span class="ajax" id="TtempTH">10:52</span> </td> |
|
Skripti värittää KAIKKI nämä solut, jotta näet kuinka se käsittelee "volume" -kutsuja. |
Another beteljuice plaything
<script> // *** CHECK FOR JQUERY !window.jQuery && document.write(unescape('%3Cscript src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"%3E%3C/script%3E')); // when and how to fire this function ? // rather than event bubblers for individual changes, thinking bog standard time loop .... // in that way we can ignore ajax and in max two loops any font colour will be correct // and we save a lot of processor work ! $(document).ready(function(){ var runwithit = setInterval(checkTemp, 400); // only required for dynamic content // else (static content) .. // checkTemp(); }); function checkTemp() { $(".Tcol").each(function() { // function[1] bert = parseInt($(this).html(), 10); // NB only looks for a number in FIRST position of string if(bert !== false) {; // allow zero // you can change logic to suit purpose (eg. unit converion of data) // modifying PARENT background-color / color (background is the 'temp' colour, text is contrasted) bulk = {'background-color' : '#FFFFFF', 'color' : '#000000'}; // 'out of range' default values // 'look-up' for INT values // CUSTOM colours / range [-50 => +50] (the beteljuices choice) // Put in array - do value check for font colour // -50 49 48 -47 -46 -45 -44 -43 -42 -41 lookUpBg = ['#3d0060','#400067','#44006e','#470075','#4b007c','#4f0083','#52008b','#560092','#5a0099','#5d00a0', '#6100a7','#6900af','#7200b8','#7b00c1','#8400ca','#8d00d3','#9600dc','#9f00e5','#a800ee','#b100f7', '#ba00ff','#a700f4','#9400e9','#8100df','#6e00d4','#5c00c9','#4900bf','#3600b4','#2300aa','#10009f', '#000096','#080896','#101097','#191898','#212099','#2a289a','#32309b','#3b389c','#43409d','#4c489e', '#54509f','#4b61a4','#4373a9','#3a85af','#3296b4','#29a8b9','#21babf','#18cbc4','#10ddc9','#07efcf', // 0 1 2 3 4 5 6 7 8 9 '#00ffd4','#07ffbe','#0effa9','#15ff93','#1dff7e','#24ff68','#2bff53','#32ff3e','#3aff28','#41ff13', '#48ff00','#5afb00','#6cf800','#7ff400','#91f100','#a4ed00','#b6ea00','#c9e600','#dbe300','#eee000', '#ffdd00','#ffc600','#ffb000','#ff9a00','#ff8300','#ff6d00','#ff5700','#ff4000','#ff2a00','#ff1400', '#ff0000','#f80000','#f10000','#ea0000','#e30000','#dd0000','#d60000','#cf0000','#c80000','#c20000', '#bc0000','#b30000','#aa0000','#a10000','#980000','#8f0000','#860000','#7d0000','#740000','#6c0000', '#640000' ]; agatha = bert+50; if(lookUpBg[agatha]) { if((bert >= -50 && bert <= -4) || (bert >= 24 && bert <= 50)) { // contrast text col = "#FFFFFF"; } else { col = "#000000"; } bulk = {'background-color' : lookUpBg[agatha], 'color' : col}; } // change background of PARENT element !!! ie. enclosing element ... // this should cope with constructs if used carefully $(this).parent().css(bulk); // or for single value pair ('background-color', col) } // end if bert }); // end function[1] }; // end function checkTemp </script>
Valikko
- Pörssisähkö
- Työkalut
- Laskimet
- Speedtest
- Kumppanit
- Mobiilisivut
- Terminologia
- Maailmankello
- Maanjäristykset
- Tähtitiede
- RSS-syötteitä
- Tuuliasteikko
- Linkit
- Sivukartta