不同范围的滑动距离

Question

我正在使用 jQuery UI Slider（从最小值到最大值）并且需要达到这个结果：

|------------------------.---------| 0 300 500

从 0 到 300 我的步长值为 1，幻灯片宽度为 70%，从 300 到 500（70% 到 100%）步长为 25。我知道如何动态更改步长，问题是宽度不同（距离）。如何使 0-300 覆盖 70% 的滑块和 300-500 仅从 70% 到 100%？提前致谢。

Answer 1

在滑动动作时从左侧检查手柄位置。还没有检查过，但这个想法可能有效

$( "#your-slider" ).on( "slide", function( event, ui ) {

    var handler_pos = $( '.ui-slider-handle' ).position().left;
    var slider_width = $( '#your-slider' ).width();
    var count = handler_pos/slider_width*100;

    if ( count > 70 ) {
        $( '#your-slider' ).slider( {'option', 'step', 25} );
    } else {
        $( '#your-slider' ).slider( {'option', 'step', 1} );
    }

});