Color picker - clicca e scompari

**ale152** · 26-03-2006, 14:43

Salve!
Premetto che non so nulla di java e js...

Ho questo script preso in giro che è un color picker, quando clicco su un colore il quadratino a fianco si colora del colore selezionato.
Il problema è che quando inserisco un valore nell'input, dall'html in value"" il quadratino non si colora di quel colore.
Come mai? C'è qualcuno in grado di aiutarmi?
Altra piccola stupidaggine, vorrei fare che quando seleziono
Sfondo pagina : immagine, mi compare solo l'input dell'immagine, quando clicco Colore unitario, compare solo l'input del color picker.

il codice è questo:

codice:

<html>

<head>
<meta http-equiv="Content-Language" content="it">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Wirgilio Digital Music - Registrazione</title>
{literal}
<script language="Javascript">
     var perline = 9;
     var divSet = false;
     var curId;
     var colorLevels = Array('0', '3', '6', '9', 'C', 'F');
     var colorArray = Array();
     var ie = false;
     var nocolor = 'none';
	 if (document.all) { ie = true; nocolor = ''; }
	 function getObj(id) {
		if (ie) { return document.all[id]; } 
		else {	return document.getElementById(id);	}
	 }

     function addColor(r, g, b) {
     	var red = colorLevels[r];
     	var green = colorLevels[g];
     	var blue = colorLevels[b];
     	addColorValue(red, green, blue);
     }

     function addColorValue(r, g, b) {
     	colorArray[colorArray.length] = '#' + r + r + g + g + b + b;
     }
     
     function setColor(color) {
     	var link = getObj(curId);
     	var field = getObj(curId + 'field');
     	var picker = getObj('colorpicker');
     	field.value = color;
     	if (color == '') {
	     	link.style.background = nocolor;
	     	link.style.color = nocolor;
	     	color = nocolor;
     	} else {
	     	link.style.background = color;
	     	link.style.color = color;
	    }
     	picker.style.display = 'none';
	    eval(getObj(curId + 'field').title);
     }
        
     function setDiv() {     
     	if (!document.createElement) { return; }
        var elemDiv = document.createElement('div');
        if (typeof(elemDiv.innerHTML) != 'string') { return; }
        genColors();
        elemDiv.id = 'colorpicker';
	    elemDiv.style.position = 'absolute';
        elemDiv.style.display = 'none';
        elemDiv.style.border = '#000000 1px solid';
        elemDiv.style.background = '#FFFFFF';
        elemDiv.innerHTML = 'Scegli un colore: ' 
          	+ getColorTable() 
        	document.body.appendChild(elemDiv);
        divSet = true;
     }
     
     function pickColor(id) {
     	if (!divSet) { setDiv(); }
     	var picker = getObj('colorpicker');     	
		if (id == curId && picker.style.display == 'block') {
			picker.style.display = 'none';
			return;
		}
     	curId = id;
     	var thelink = getObj(id);
     	picker.style.top = getAbsoluteOffsetTop(thelink) + 20;
     	picker.style.left = getAbsoluteOffsetLeft(thelink);     
	picker.style.display = 'block';
     }
     
     function genColors() {
        addColorValue('0','0','0');
        addColorValue('3','3','3');
        addColorValue('6','6','6');
        addColorValue('8','8','8');
        addColorValue('9','9','9');                
        addColorValue('A','A','A');
        addColorValue('C','C','C');
        addColorValue('E','E','E');
        addColorValue('F','F','F');                                
			
        for (a = 1; a < colorLevels.length; a++)
			addColor(0,0,a);
        for (a = 1; a < colorLevels.length - 1; a++)
			addColor(a,a,5);

        for (a = 1; a < colorLevels.length; a++)
			addColor(0,a,0);
        for (a = 1; a < colorLevels.length - 1; a++)
			addColor(a,5,a);
			
        for (a = 1; a < colorLevels.length; a++)
			addColor(a,0,0);
        for (a = 1; a < colorLevels.length - 1; a++)
			addColor(5,a,a);
			
			
        for (a = 1; a < colorLevels.length; a++)
			addColor(a,a,0);
        for (a = 1; a < colorLevels.length - 1; a++)
			addColor(5,5,a);
			
        for (a = 1; a < colorLevels.length; a++)
			addColor(0,a,a);
        for (a = 1; a < colorLevels.length - 1; a++)
			addColor(a,5,5);

        for (a = 1; a < colorLevels.length; a++)
			addColor(a,0,a);			
        for (a = 1; a < colorLevels.length - 1; a++)
			addColor(5,a,5);
			
       	return colorArray;
     }
     function getColorTable() {
         var colors = colorArray;
      	 var tableCode = '';
         tableCode += '<table border="0" cellspacing="2" cellpadding="0">';
         for (i = 0; i < colors.length; i++) {
              if (i % perline == 0) { tableCode += '<tr>'; }
              tableCode += '<td bgcolor="#000000"></td>';
              if (i % perline == perline - 1) { tableCode += '</tr>'; }
         }
         if (i % perline != 0) { tableCode += '</tr>'; }
         tableCode += '</table>';
      	 return tableCode;
     }
     function relateColor(id, color) {
     	var link = getObj(id);
     	if (color == '') {
	     	link.style.background = nocolor;
	     	link.style.color = nocolor;
	     	color = nocolor;
     	} else {
	     	link.style.background = color;
	     	link.style.color = color;
	    }
	    eval(getObj(id + 'field').title);
     }
     function getAbsoluteOffsetTop(obj) {
     	var top = obj.offsetTop;
     	var parent = obj.offsetParent;
     	while (parent != document.body) {
     		top += parent.offsetTop;
     		parent = parent.offsetParent;
     	}
     	return top;
     }
     
     function getAbsoluteOffsetLeft(obj) {
     	var left = obj.offsetLeft;
     	var parent = obj.offsetParent;
     	while (parent != document.body) {
     		left += parent.offsetLeft;
     		parent = parent.offsetParent;
     	}
     	return left;
     }


</script>
{/literal}
</head>

<body>

<div align="center">
	
  <table border="0" style="border-collapse: collapse" width="75%" height="75" cellpadding="6">
    <tr> 
       <td style="border-left-style: solid; border-left-width: 1px; border-right-style: none; border-right-width: medium; border-top-style: solid; border-top-width: 1px; border-bottom-style: none; border-bottom-width: medium" bordercolor="#666666" bgcolor="#F2F2F2" height="25" width="227"> 
        <p align="center"><font color="#808080" face="Verdana" size="1">..:: M E N U ::..</font></td>
      <td style="border-left-style: none; border-left-width: medium; border-right-style: solid; border-right-width: 1px; border-top-style: solid; border-top-width: 1px; border-bottom-style: solid; border-bottom-width: 1px" bordercolor="#666666" bgcolor="#F2F2F2" rowspan="2" valign="top"> 
        <p align="center"> <font face="Arial Black" size="4" color="#808080">WIRGILIO 
          MUSIC

          ________________________________</font></p>
        <p align="center">
        

<font face="verdana">Registrazione Wirgilio

		

<font face="verdana">Da qui puoi modificare i dati del tuo blog</font></p>
        </font>
<form action="amministrazione.php" method="post" enctype="multipart/form-data">
          

<font face="verdana"><font face="verdana"> <font size="5">Informazioni 
            Blog </font></font></font></p>
          

<font face="verdana">Titolo del Blog

            <input name="blog_titolo" type="text" id="blog_titolo" value="{$nome_blog}" maxlength="30" >
            </font></p>
          

<font face="verdana">Testo di benvenuto:  

            <textarea name="blog_descrizione" cols="40" rows="4" id="blog_descrizione">{$benvenuto_blog}</textarea>
            </font></p>
          

<font face="verdana">Carattere Testo Blog</font></p>
          

 
            <select name="blog_font">
              {$selezione_blog_font}
            </select>
          </p>
          

<font face="verdana">Carattere Testo Intestazione</font></p>
          

 
            <select name="intestazione_font">
              {$selezione_intestazione_font}
            </select>
          </p>
          

<font face="verdana">Colore del testo</font></p>
          

  
            <input name="blog_colore_testo" id="pick1116105255field" title="color" onchange="relateColor('pick1116105255', this.value);" value="{$colore_testo}" size="7" maxlength="7">
          </p>
          

<font face="verdana">Sfondo Pagina</font></p>
          

<font face="verdana"> 
            <input type="radio" name="radiobutton" value="radiobutton">
            Immagine 
            <input type="radio" name="radiobutton" value="radiobutton">
            Colore Unitario</font></p>
          


            
             
            <input name="blog_colore_sfondo" id="pick1116105256field" title="color" onchange="relateColor('pick1116105256', this.value);" value="{$colore_sfondo}" size="7" maxlength="7">
            
            
            <input name="blog_sfondo_file" type="file" id="blog_sfondo_file" size="50" maxlength="50">
            
          </p>
          

<font face="verdana">Colore sfondo menù</font></p>
          

 
            <input name="blog_colore_menu" id="pick1116105257field" title="color" onchange="relateColor('pick1116105257', this.value);" value="{$colore_menu}" size="7" maxlength="7">
          </p>
          

<font face="verdana">Colore sfondo intestazione</font></p>
          

 
            <input name="blog_colore_intestazione" id="pick1116105258field" title="color" onchange="relateColor('pick1116105258', this.value);" value="{$colore_intestazione}" size="7" maxlength="7">
          </p>
          

 <font face="verdana"> </font> 
            <input type="hidden" name="accesso" value="modifica">
			<input type="submit" value="Invia"></font>
            </font> </p>
          </form> 

</p>
        <p align="justify"></td>
    </tr>
    <tr> 
      <td valign="top" bordercolor="#666666" bgcolor="#666666" style="border-left-style: solid; border-left-width: 1px; border-right-style: none; border-right-width: medium; border-top-style: none; border-top-width: medium; border-bottom-style: solid; border-bottom-width: 1px"> 
        <div align="center"> 
          <table width="100%" border="0">
            <tr>
              <td><font color="#FFFFFF" size="3" face="verdana"> </font></td>
            </tr>
            <tr> 
              <td><font color="#FFFFFF" size="3" face="verdana"> </font></td>
            </tr>
            <tr> 
              <td height="139" valign="top"><font color="#FFFFFF" size="3" face="verdana"> 
                <form action="blog.php" method="get">
                  Cerca Blog utente: 

                  <input type="text" name="utente">

                  Tipo di account:

<input type="radio" name="account" value="musica">Musica 

<input type="radio" name="account" value="grafica">Grafica

<input type="radio" name="account" value="graficamusica">Entrambi

                  <input type="submit" value="Cerca">
				                 </form>
                </font></td>
            </tr>
          </table>
        </div></td>
    </tr>
  </table>
</div>

</body>

</html>

Grazie infinite in anticipo a chi mi aiuterà,
Ale152

Discussione: Color picker - clicca e scompari

Strumenti discussione

Ricerca discussione

Visualizza

Visualizzazione discussione

Color picker - clicca e scompari

Permessi di invio