The Inlet library provides the sliders and color picker for building-blocks.
Try clicking on a number or color value in this example!
Last active
September 4, 2015 19:11
-
-
Save enjalot/8ed34ca589e8b0cb9d3c to your computer and use it in GitHub Desktop.
Inlet demo
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script> | |
| </head> | |
| <body> | |
| <span id="answer" style="text-align:center;display:block;width:100%"></span> | |
| <script> | |
| // The inlet library provides the sliders and color picker for building-blocks | |
| // https://github.com/enjalot/Inlet | |
| // Click on the hex value or number below: | |
| var color = "#00588e" | |
| var theAnswer = 42; | |
| d3.select("#answer").text(theAnswer) | |
| .style({color: color, "font-size": "442px"}) | |
| var decimal = 29.5; | |
| var tinyDecimal = 0.5; | |
| var noZero = .5; | |
| //You can also use hsl colors | |
| var hsl = "hsl(133,100%,90%)"; | |
| d3.select("body").style("background-color", hsl); | |
| // You can also use rgb colors | |
| var rgb = "rgb(0,229,91)"; | |
| </script> | |
| </body> | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment