JavaScript - Lichtregler
Diese wenigen
Array-Optionen für den Farbverlauf kopieren.
<script>
function lichtregler(wert) {
let farben = ["#FFFFFF", "#FEFEFE", "#FDFDFD", "#FBFBFB", "#FAFAFA", "#F9F9F9", "#F8F8F8", "#F7F7F7", "#F5F5F5", "#F4F4F4",
"#F3F3F3", "#F2F2F2", "#F1F1F1", "#F0F0F0", "#EFEFEF", "#EEEEEE", "#EDEDED", "#ECECEC", "#EBEBEB", "#EAEAEA",
"#E8E8E8", "#E7E7E7", "#E6E6E6", "#E5E5E5", "#E4E4E4", "#E2E2E2", "#E1E1E1", "#E0E0E0", "#DFDFDF", "#DEDEDE",
"#DCDCDC", "#DBDBDB", "#DADADA", "#D9D9D9", "#D8D8D8", "#D7D7D7", "#D5D5D5", "#D4D4D4", "#D3D3D3", "#D2D2D2",
"#D1D1D1", "#CFCFCF", "#CECECE", "#CDCDCD", "#CCCCCC", "#CBCBCB", "#C9C9C9", "#C8C8C8", "#C7C7C7", "#C6C6C6",
"#C5C5C5", "#C4C4C4", "#C2C2C2", "#C1C1C1", "#C0C0C0", "#BFBFBF", "#BEBEBE", "#BCBCBC", "#BBBBBB", "#BABABA",
"#B9B9B9", "#B8B8B8", "#B6B6B6", "#B5B5B5", "#B4B4B4", "#B3B3B3", "#B2B2B2", "#B0B0B0", "#AFAFAF", "#AEAEAE",
"#ADADAD", "#ACACAC", "#ABABAB", "#A9A9A9", "#A8A8A8", "#A7A7A7", "#A6A6A6", "#A5A5A5", "#A3A3A3", "#A2A2A2",
"#A1A1A1", "#A0A0A0", "#9F9F9F", "#9D9D9D", "#9C9C9C", "#9B9B9B", "#9A9A9A", "#999999", "#979797", "#969696",
"#959595", "#949494", "#939393", "#929292", "#909090", "#8F8F8F", "#8E8E8E", "#8D8D8D", "#8C8C8C", "#8A8A8A",
"#898989", "#888888", "#878787", "#868686", "#848484", "#838383", "#828282", "#818181", "#808080", "#7E7E7E",
"#7D7D7D", "#7C7C7C", "#7B7B7B", "#7A7A7A", "#797979", "#777777", "#767676", "#757575", "#747474", "#737373",
"#717171", "#707070", "#6F6F6F", "#6E6E6E", "#6D6D6D", "#6B6B6B", "#6A6A6A", "#696969", "#686868", "#676767",
"#656565", "#646464", "#636363", "#626262", "#616161", "#606060", "#5E5E5E", "#5D5D5D", "#5C5C5C", "#5B5B5B",
"#5A5A5A", "#585858", "#575757", "#565656", "#555555", "#545454", "#525252", "#515151", "#505050", "#4F4F4F",
"#4E4E4E", "#4D4D4D", "#4B4B4B", "#4A4A4A", "#494949", "#484848", "#474747", "#454545", "#444444", "#434343",
"#424242", "#414141", "#3F3F3F", "#3E3E3E", "#3D3D3D", "#3C3C3C", "#3B3B3B", "#393939", "#383838", "#373737",
"#363636", "#353535", "#343434", "#323232", "#313131", "#303030", "#2F2F2F", "#2E2E2E", "#2C2C2C", "#2B2B2B",
"#2A2A2A", "#292929", "#282828", "#262626", "#252525", "#242424", "#232323", "#222222", "#202020", "#1F1F1F",
"#1E1E1E", "#1D1D1D", "#1C1C1C", "#1B1B1B", "#191919", "#181818", "#171717", "#161616", "#151515", "#131313",
"#121212", "#111111", "#000000"];
document.getElementsByTagName('body')[0].style.backgroundColor = farben[wert];
}
</script>
<input type="range" value="0" min="0" max="203" step="1" onInput="lichtregler(this.value)">
max="203", ist die Anzahl der Elemente im Array!
Mein Tipp:
Mit dem Farbverlauf Generator lassen sich
andere Farbverläufe für den JavaScript-Code erstellen.
Bausteine Alle Anzeigen
Eine zufällige Auswahl von Codeschnipseln
aus den Bereichen
HTML, CSS,
PHP, JavaScript und
MySQL.
<ul> Aufzählungsliste