Formiin liitettävä varinvalitsin. Tein tämän Blazen värikartan pohjalta, joten propsit siitä hänelle.
Toimii yhdellä funktiolla:
varikartta('tähän haluttu inputin nimi','tähän oletusväri');
<?php function varikartta($inputinnimi,$oletusvari) { // Tekee <input type="hidden" name="inputinnimi" value="(valittu väri)"> // toimii kylläkin vain firefoxilla mutta pienellä ruukkauksella toimii kaikilla // scripti mikä mahdollistaa tämän kaiken $varikartta.= ' <script type="text/javascript"> function nayta(tila,vari) { kartta=document.getElementById(\'varikarttadivi\').style; divi=document.getElementById(\'varidivi\').style; inputti=document.getElementById(\'varikarttainput\'); switch(tila) { case 0: kartta.display = "none"; divi.backgroundColor = "#" + vari; inputti.value= vari break; case 1: kartta.display = "block"; // kartta.left ?? break; } } </script> '; // html:t $varikartta.= '<input type="hidden" name="'.$inputinnimi.'" value="'.$oletusvari.'" id="varikarttainput">'; $varikartta.= '<div id="varikarttadivi" style="display: none; position: absolute;" >'."\n"; $varikartta.= '<style>.varikarttanodi { width: 0.5em; height: 0.5em; float: left; border: 1px black solid; overflow: hidden;}</style>'; // Kasvatetaan kaikkia kolmea värikomponenttia aloittaen nollasta 0x33:n style="display: hidden;" // (desimaalina 51) askelin. $laskuri=0; for($r = 0; $r <= 255; $r += 51) { // r niinkuin punainen for($g = 0; $g <= 255; $g += 51) { // g niinkuin vihreä $varikartta.= '<div display="float: left;">'; for($b = 0; $b <= 255; $b += 51) { // ja b niinkuin sininen //Muodostetaan kolmesta komponentista yksi heksadesimaaliluku muotoa rrggbb. Ärrät saadaan paikoilleen kertomalla 0x10000:lla (desimaalina 65536), geet kertomalla 0x100:lla (desimaalina 256) ja beet kertomalla ykkösellä. Näiden summa muutetaan merkkijonoksi helpompaa käsittelyä varten. $vari = (string) dechex(65536 * $r + 256 * $g + $b); // Lisätään etunollat, jos puuttuvat while(strlen($vari) < 6) { $vari = '0' . $vari; } $varikartta.= '<a href="javascript:nayta(0,\''.$vari.'\');"><div class="varikarttanodi" style="background-color: #'.$vari.';"> </div></a>'."\n"; } $varikartta.= "</div>"."\n"; if ($laskuri == 5) {$varikartta.= '<br style="font-size: 0.5em;">'; $laskuri=0;} else $laskuri++; } } $varikartta.= "</div>\n"; $varikartta.= "<a href=\"javascript:nayta(1,'');\"><div id=\"varidivi\" style=\"width: 5em; height: 1em; background-color: #".$oletusvari.";\"></div></a>"; return $varikartta; } // varikartta loppu ?>
<html><head><TITLE>Värinvalitsin</TITLE></head> <body> <?php if (isset($_POST['valittuvari'])) echo "Valittu väri: ".$_POST['valittuvari']."<br><br>"; ?> <form method="POST" enctype="multipart/form-data"> Valitse väri:<br> <?php echo varikartta('valittuvari','000000') ?> <br> <br> <input type="submit" value="Naytä valittu väri"> </form> </body></html>
Esimerkki?
En oikein älynnyt tuota tarkoitusta, enkä siis saanut sitä toimimaan Firefoxillakaan, mutta väliäkös hällä.
Korjasin hieman esimerkki löytyy osoitteesta:
Näyttää ihan pätevältä. Ainoana miinuksena tulee JavaScripti, jonka ansiosta sivun pituus venyy ilkeästi ja aiheuttaa toimimattomuuden joillakin. No mutta, on mikä on.
Hmm mielenkiintoista...
Aihe on jo aika vanha, joten et voi enää vastata siihen.