Skip to content

Instantly share code, notes, and snippets.

@vhoyer
Created April 27, 2018 16:09
Show Gist options
  • Save vhoyer/b4c45e4c4907451cf05b2241448e7579 to your computer and use it in GitHub Desktop.
Save vhoyer/b4c45e4c4907451cf05b2241448e7579 to your computer and use it in GitHub Desktop.
Teste suas cores em Hex
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input autofocus type="text" id="color" />
<div id="colors"></div>
<style>
#colors{
display: flex;
flex-flow: row wrap;
}
#colors div {
width: 100px;
height: 100px;
line-height: 100px;
text-align: center;
}
</style>
<script src="https://cdn.jsdelivr.net/gh/vhoyer/jQ@1.0.0/jQ.js"></script>
<script type="text/javascript">
$('#color').value = "#";
$('#color').on("keyup",function(e){
if (e.key === "Enter"){
e.preventDefault();
$('#colors').innerHTML += (`<div style="background-color:${$('#color').value};">${$('#color').value}</div>`);
$('#color').value = "#";
}
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment