Browse Source

Add tooltips to sliders

fastled
Xose Pérez 7 years ago
parent
commit
6a48374fe9
2 changed files with 17 additions and 1 deletions
  1. +7
    -1
      code/html/custom.css
  2. +10
    -0
      code/html/custom.js

+ 7
- 1
code/html/custom.css View File

@ -151,7 +151,7 @@ div.state {
} }
.slider { .slider {
margin-top: 12px;
margin-top: 10px;
} }
.slider .noUi-target { .slider .noUi-target {
background: #D2D2D2; background: #D2D2D2;
@ -159,3 +159,9 @@ div.state {
.slider .noUi-connect { .slider .noUi-connect {
background: #FFFFFF; background: #FFFFFF;
} }
.slider .noUi-tooltip {
font-size: 10px;
border: 0px;
padding: 0px;
margin-bottom: -4px;
}

+ 10
- 0
code/html/custom.js View File

@ -301,6 +301,11 @@ function initColor() {
noUiSlider.create($("#brightness").get(0), { noUiSlider.create($("#brightness").get(0), {
start: 255, start: 255,
connect: [true, false], connect: [true, false],
tooltips: true,
format: {
to: function (value) { return parseInt(value); },
from: function (value) { return value; }
},
orientation: "horizontal", orientation: "horizontal",
range: { 'min': 0, 'max': 255} range: { 'min': 0, 'max': 255}
}).on("change", function() { }).on("change", function() {
@ -335,6 +340,11 @@ function initChannels(num) {
noUiSlider.create($(".slider", line).get(0), { noUiSlider.create($(".slider", line).get(0), {
start: 0, start: 0,
connect: [true, false], connect: [true, false],
tooltips: true,
format: {
to: function (value) { return parseInt(value); },
from: function (value) { return value; }
},
orientation: "horizontal", orientation: "horizontal",
range: { 'min': 0, 'max': 255 } range: { 'min': 0, 'max': 255 }
}).on("change", function() { }).on("change", function() {


Loading…
Cancel
Save