Paleta de colores dentro de un select

#1 (**permalink**) 10/01/2009, 04:38

Buenas!!!

Consegui crear un codigo en javascript simple para una paleta de colores. Ahora me gustaria saber como meter la paleta en un select.

Código javascript:

Ver original<html>
<head>
<script type="text/javascript">
 
var r=new Array("00","33","66","99","CC","FF");
var g=new Array("00","33","66","99","CC","FF");
var b=new Array("00","33","66","99","CC","FF");
var color=new Array();
var ind_col=0;
var ind_1=0;
var ind_2=0;
var ind_3=0;
 
for(ind_1 in r)
{
    for(ind_2 in g)
    {
        for(ind_3 in b)
        {
            color[ind_col]="#"+r[ind_1]+g[ind_2]+b[ind_3];
            ind_col++;
        }
    }
}
</script>
</head>
<body>
<select>
<!-- aqui tiene que ir las opcion (los colores ha elegir) -->
</select>
</body>
</html>

caricatos · #2 (**permalink**) 10/01/2009, 08:25

Hola:

Tal vez en este viejo mensaje: Todo sobre colores encuentres algo que te sirva...

Saludos

#3 (**permalink**) 11/01/2009, 06:54

Muchas gracias por la ayuda... este problema esta resuelto...

Código javascript:

Ver originalfor(ind_col in color)
{
    var opcion=document.createElement('option');
    document.getElementById('color_select').options.add(opcion);
    opcion.appendChild(document.createTextNode(color[ind_col]));
    opcion.value=color[ind_col];
    opcion.style.background=color[ind_col];
    opcion.setAttribute('onclick', 'escribe_color(\''+color[ind_col]+'\')');
    document.getElementById('color_select').options.selectedIndex=0;
}

Pero ahora tengo un pequeño problema que no se como resolver... El setAttribute con IE no funciona... Sabies alguna forma de poner un evento en IE...

JoseTejada · #4 (**permalink**) 11/01/2009, 11:27

Hace un tiempo estuve probando algo parecido, y me salieron muchas cosas interesantes, solo es cuestión de probar de todo...Cheka este codigo, hace lo que necesitas, pero derrepente no como tú quieres...Pero weno...ahi está. Aioz...:

Código HTML:

<html>
<head><title>Paleta de Colores...</title>
<script language='JavaScript'>
  function pintarTabla(cb){
      var indice = cb.options.selectedIndex;
      var color= cb.options[indice].text;
      document.getElementById('miLabel').style.background=color;         
  }  
  var A=new Array("00","33","66","99","CC","FF");
  var texto="<select onChange='pintarTabla(this)'>";
     for(i=0;i<6;i++){
      for(j=0;j<6;j++){
        for(k=0;k<6;k++){               
               texto +="<option>#"+A[i]+A[j]+A[k]+"</option>";
        }
      }
    }
  texto+="</select>";
 document.write(texto);
</script>
</head>
<body>
<div id="aqui">
 <label id="miLabel">texto en label
 </label>
</div>
</body>
</html>

JoseTejada · #5 (**permalink**) 11/01/2009, 11:29

Aqui tengo otras de las cosas que probé... quizás le sirva a alguien...Aiozz

Código HTML:

<html>
<head><title>Paleta de Colores...</title>

<script language='JavaScript'>
  function pintarTabla(cb){
      var indice = cb.options.selectedIndex;
      var color= cb.options[indice].text;
      document.getElementById('miLabel').style.background=color;
  }
  function setColor(col){
   document.getElementById('miLabel').value=col; 
  }
  function Cursor(celda){
    celda.style.cursor='hand';
  }
  var A=new Array("00","33","66","99","CC","FF");
  var texto="<table>";
  var col="";
     for(i=0;i<6;i++){texto+="<tr>";
      for(j=0;j<6;j++){
        for(k=0;k<6;k++){
               col="#"+A[i]+A[j]+A[k];
	 texto +="<td bgcolor='"+col+"'onMouseOver=setColor('"+col+"')  onMouseMove=Cursor(this)>&nbsp;&nbsp;&nbsp;&nbsp;</td>";

        }
      }
    }
  texto+="</table>";
 document.write(texto);
</script>
</head>
<body>
<div id="aqui">
 <input type="text" id="miLabel" />
</div>
</body>
</html>

Espero sea de utilidad...

caricatos · #6 (**permalink**) 11/01/2009, 15:24

Hola:

En explorer sí que funciona setAttribute; lo que no funciona es el onclick en los options... debes implementar el onchange del tag select:

<select onchange="escribe_color(this.value)"...

Saludos