Как написать .trigger('change) на js?

Question

[Unknown]

Привет!
Есть codepan с ползунком на JQuery
Если изменить значение в этом примере, то метод .trigger будет отслеживать изменение свойства backgroundSize

Есть codepan с ползунком на Javascript
Если изменить значение в этом примере, то свойство backgroundSize будет отслеживаться только после того как мы отпустим кнопку мышки.
В гугле видел примеры с dispatchEvent, попробовав реализовать у себя, не сработало.

Вопрос: как реализовать метод .trigger на js ?

Comments

[kulaeff]

https://stackoverflow.com/questions/2490825/how-to...

[Unknown]

kulaeff, спасибо

Answer 1

[Unknown]

Решение

var sliderChange = document.querySelector('input[type=range');


sliderChange.onchange = function () {
	sliderChangeFunc();
};

function sliderChangeFunc() {
	var value = sliderChange.value,
			min   = sliderChange.getAttribute('min'),
			max   = sliderChange.getAttribute('max');
	sliderChange.style.backgroundSize = (value - min) * 100 / (max - min) + '%' + ' 100%';
};

sliderChange.addEventListener("input", function(e) {
  sliderChangeFunc();// Prints "Example of an event"
});

// Create the event
var event = new CustomEvent("input");

// Dispatch/Trigger/Fire the event
sliderChange.dispatchEvent(event);