rangeslider.js mousedown event not working on slider button

[0x2018]

1down votefavorite | Mouse event is not firing. Need to know the hold event so can disable the update of slider value. my code is,

var sliding = false; function update_seek_value(value) { if (!sliding) { $("#replay-slider").val(value).change(); } } $('.slider_button_class_name').on('mousedown', function () { sliding = true; });

[andreruffert]

The mouse event would fire, but the plugin prevents the mousedown event. Another thing would be that the event listener would not work because at the time you add the event the element might not even be in the DOM (for this you should use event delegation).

This is one approach I could think of:

$(function() {
  var isSliding = false;

  $('input[type=range]').rangeslider({
    polyfill: false,
    onSlide: function(position, value) {
      isSliding = true;
    },
    onSlideEnd: function(position, value) {
      isSliding = false;
    }
  });

});

Another one could be checking for the rangeslider--active class e.g:

var $element = $('input[type=range]');

function update_seek_value(value) {
  var isActive = $element.hasClass('rangeslider--active');

  if (!isActive) {
    ...
  }
}

[0x2018]

The music progress bar, you can't use this method. I need to stop rolling while dragging.

[andreruffert]

Actually it seems to be a bug in Chrome (tested with Version 62.0.3202.94). This line (e.preventDefault()) should just prevent the default events but Chrome seems to stop the event from bubbling somehow.

Here is an example I created some time ago https://codepen.io/andreruffert/pen/MwXezm I tried it in Firefox and Safari and it works like it should but in Chrome the event does not bubble for some reason...