options/options.js
/**
  * Create range-slider and add required handlers.
  * @param {object} options
  */
Create range-slider and add required handlers.
@param {object} options
Create range - slider and add required handlers . @param { object } options
function createSliders(opt) {
    rangeSlider.create(marginTop, {
      polyfill: true,
      root: document,
      rangeClass: 'rangeSlider',
      disabledClass: 'rangeSlider--disabled',
      fillClass: 'rangeSlider__fill',
      bufferClass: 'rangeSlider__buffer',
      handleClass: 'rangeSlider__handle',
      startEvent: ['mousedown', 'touchstart', 'pointerdown'],
      moveEvent: ['mousemove', 'touchmove', 'pointermove'],
      endEvent: ['mouseup', 'touchend', 'pointerup'],
      vertical: false,
      min: 0,
      max: 90,
      step: 1,
      value: marginTop.value,
      buffer: 0,
      onInit: function () {
        let handle = this.range.querySelector(".rangeSlider__handle");
        let handleValueElm = document.createElement("div");
        handleValueElm.className = "rangeSlider__handle__value";
        handleValueElm.innerText = this.value + " %";
        handle.appendChild(handleValueElm);
      },
      onSlideStart: function (position, value) {},
      onSlide: function (position, value) {
        let handle = this.range.querySelector(".rangeSlider__handle__value");
        handle.innerText = this.value + " %";
      },
      onSlideEnd: function (position, value) {
        saveOptions();
      }
    });
  }
function createSliders ( opt ) { rangeSlider . create ( marginTop , { polyfill : true , root : document , rangeClass : 'rangeSlider' , disabledClass : 'rangeSlider--disabled' , fillClass : 'rangeSlider__fill' , bufferClass : 'rangeSlider__buffer' , handleClass : 'rangeSlider__handle' , startEvent : [ 'mousedown' , 'touchstart' , 'pointerdown' ] , moveEvent : [ 'mousemove' , 'touchmove' , 'pointermove' ] , endEvent : [ 'mouseup' , 'touchend' , 'pointerup' ] , vertical : false , min : 0 , max : 90 , step : 1 , value : marginTop . value , buffer : 0 , onInit : function ( ) { let handle = this . range . querySelector ( ".rangeSlider__handle" ) ; let handleValueElm = document . createElement ( "div" ) ; handleValueElm . className = "rangeSlider__handle__value" ; handleValueElm . innerText = this . value + " %" ; handle . appendChild ( handleValueElm ) ; } , onSlideStart : function ( position , value ) { } , onSlide : function ( position , value ) { let handle = this . range . querySelector ( ".rangeSlider__handle__value" ) ; handle . innerText = this . value + " %" ; } , onSlideEnd : function ( position , value ) { saveOptions ( ) ; } } ) ; }
Create range-slider and add required handlers.
Create range - slider and add required handlers .