Member-only story
The code is from Eliel Kiiskinen.
Html
the controls include three handler range menu, changing spacing size, blurring number, and the background color.
Css
set the image style with var()
Javascript
select all the inputs and loop each one, when changing the value, run handleUpdate() function.
when console.log(this.dataset)
the sizing is ‘px’, because of the setting in HTML
setProperty with the value and suffix.
The CSSStyleDeclaration.setProperty()
method interface sets a new value for a property on a CSS style declaration object. more info