open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

use mousewheel to change a focused input[type=range]

Browse Source
This commit is contained in:
tophf 2020-11-09 22:59:42 +03:00
parent dc4819e7d0
commit 30b9378d2c
1 changed files with 7 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
js/dom.js
View File

@ -97,10 +97,13 @@ document.on('wheel', event => {
if (!el || el !== event.target && !el.contains(event.target)) { if (!el || el !== event.target && !el.contains(event.target)) {
return; return;
} }
if (el.tagName === 'SELECT') { const isSelect = el.tagName === 'SELECT';
const old = el.selectedIndex; if (isSelect || el.tagName === 'INPUT' && el.type === 'range') {
el.selectedIndex = Math.max(0, Math.min(el.length - 1, old + Math.sign(event.deltaY))); const key = isSelect ? 'selectedIndex' : 'valueAsNumber';
if (el.selectedIndex !== old) { const old = el[key];
const rawVal = old + Math.sign(event.deltaY) * (el.step || 1);
el[key] = Math.max(el.min || 0, Math.min(el.max || el.length - 1, rawVal));
if (el[key] !== old) {
el.dispatchEvent(new Event('change', {bubbles: true})); el.dispatchEvent(new Event('change', {bubbles: true}));
} }
event.preventDefault(); event.preventDefault();