Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

hadnet

quadrinho que seleciona a cor

Por , em Javascript

Recommended Posts

hadnet    1

hadnet
Postado

galera,

 

to montando um sistema, onde terei um input que sera preenchido com o codigo da cor e do lado do input eu terei que colocar um selecionador de cores, tipo o cara clica sobre esse selecionador de cores ai abrem varios cores pra ele selecionar a cor desejada e ai ele clicando sobre a cor preenche o input com o codigo html da cor tipo #CCCCCC, tipo quando a gente no dreamwaver clica no desinho da cor pra slecionar a cor...

 

ja vi varios sites com isso, mas nao to achando nada... me ajudem....

Compartilhar este post

Link para o post
Compartilhar em outros sites

augustoclaro    2

augustoclaro
Postado

isso é dúvida em javascript

 

vou mover tópio

 

Tópico movido

 

ASP :seta: JavaScript

 

@topic

 

eu já fiz um esquema desses mas eu não encontrei em meu computador...

 

Vou fazer e te enviar.

 

Talvez algum outro membro te d~e uma solução melhor antes de mim.

------------------------------------------

EDIT:

Olá!

 

Eu fiz aqui para você

 

espero que isso te ajude a fazer o seu próprio.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sem título</title>
<script>
//0 3 6 9 C F
chars = "0,3,6,9,C,F";
chars = chars.split(",");
var cores = "";
for (a=0;a<=5;a++){
for (b=0;b<=5;b++){
for (c=0;c<=5;c++){
if (cores != ""){
cores+=",";
}
cores+="#"+chars[a]+chars[b]+chars[c];
}	
}	
}
cores = cores.split(",");
var cor = "#000";


function mudacor(c){
cor = c;
}

function out(){
document.getElementById('box').style.background=cor;	
}
</script>
<style>
.quadradinho{
padding:0px;
border:1px solid black;
width:10px;
height:10px;
float:left;
cursor:pointer;
}

#quadro{
width:217px;
height:144px;
}

#box{
background:#000;	
}
</style>
</head>

<body>
<div id="quadro">
<script>
count = 0;
for (i=0;i<cores.length;i++){
document.write("<div onmouseover=\"document.getElementById('box').style.background='"+cores[i]+"';\" onmouseout=\"out();\" onclick=\"mudacor('"+cores[i]+"');\" class=\"quadradinho\" style=\"background-color:"+cores[i]+";\"> </div>");
 count++;
 if (count == 18){
	count = 0;
	//document.write("<br />");
 }
}
</script>
</div>
<hr />
<div id="box">
 
</div>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito