Transcript from the "Dynamic Form Element Styling" Lesson
[00:00:23] So we can go over every input in our page, or we could go over just range inputs, but in this case we're going over all inputs. And we set a value custom property with the current value. And then we also obviously need to monitor the input event so that we can update this value property otherwise it wouldn't be very useful.
[00:00:44] And let's see how we can use that, so here we have a slider we've applied slight a little bit of CSS to make it styleable. And we have this fixed radial gradient. And the code that I've showed you is already applied here. So what I want is for this.
[00:01:07] Gradient to adjust, so that when I move the slider handle, it actually shows me how far I am. So the value property would range from 0 to 100 because it's just reflecting the value of the sliders. And right now in outage the mail, I just have an input type equals range with no min and max specified so I get the 0 to 100 that is the default.
[00:01:33] I can go there and multiply value with. I have 0 to 100, I wanna make it 0 to 100%. So just be more multiplying it by 1%. And as you can see it adapts, it needs a little bit of tweaking to make to actually look nice but the main idea is there.