jQuery Slider 핸들을 제 위치에 고정시키는 방법은 무엇입니까?

Question

두 개의 핸들이있는 jQuery 슬라이더가 있습니다. 두 번째 핸들을 기반으로 첫 번째 위치를 잠그려고합니다.

슬라이드 슬라이드 이벤트의 값을 확인한 다음 첫 번째 핸들을 다시 잠금 위치로 설정했지만 기본적으로 설정 한 내용을 무시하고 슬라이드를 계속합니다.

나는 정지 이벤트와 함께 작동하도록했으나 매우 까다 롭습니다.

서버 측에서 생성 된 JSON 객체를 사용하여 슬라이더를 채 웁니다. 이것은 내 이벤트를 중지하는 코드입니다.

$(clientID).slider({ 
     range: true, 
     max: slider.max, 
     values: [slider.minVal, slider.maxVal], 
     change: afterSliderChanged, 
     stop: onSliderStop 
    }); 

    function onSliderStop(event, ui) { 
    for (i in sliders.sliders) { 
     var slider = sliders.sliders[i]; 
     var clientID = slider.cellType + "_" + slider.objectID + "_null"; 

     if (this.id == clientID) { 
      if (ui.values[0].toString() == slider.max.toString()) { 
       var values = $(this).slider('option', 'values'); 
       $(this).slider('option', 'values', [parseInt(slider.max - 1), parseInt(values[1])]); 
      } 
     } 
    } 

누구든지 아이디어가 있습니까?

제가 정교해야하는지 알려주세요.

감사합니다. 다니엘 브루

다음

Answer 1

신속하고 더러운 끌고있는 핸들과 관련하여 다른 핸들을 고정하는 방법의 예는 다음과 같습니다

var offset = 40; 
$('#slider').slider({ 
    range: true, 
    max: 600, 
    values: [40, 80], 
    slide: function(e,ui){ 
     if (ui.value == ui.values[0]) { 
      $(this).slider('values',1, ui.value+offset); 
     } else { 
      $(this).slider('values',0, ui.value-offset); 
     } 
    } 
}); 

당신이 원하는 무엇을하는 방법을 알아내는 데 도움이해야는 할 것.

동작 예 : http://jsfiddle.net/cBHdD/

Answer 2

여기서 @ PetersenDidit의 jsfiddle의 약간 덜 빠른 앤 더러운 버전 잠금이 서로에 대해 처리하는, 그리고 또한 그래서,이 슬라이더의 끝단에 그들 사이의 오프셋 클램프 범위는 maxOff 이하로 축소 할 수 없습니다.

var max = 600; 
var maxOff = 40; 

$('#slider').slider({ 
    range: true, 
    max: max, 
    values: [40, 80], 
    slide: function(e,ui){ 
     if (ui.value == ui.values[0]) { 
      $(this).slider('values', 1, ui.value+maxOff); 
      if (ui.value >= max - maxOff) { 
       $(this).slider('values', 0, max - maxOff); 
       return false; 
      } 
     } else { 
      $(this).slider('values',0, ui.value-maxOff); 
      if (ui.value <= maxOff) { 
       $(this).slider('values', 1, maxOff); 
       return false; 
      } 
     } 
    } 
}); 

http://jsfiddle.net/tbWE5/

: 키는 현재의 드래그 값을 적용에서 JQuery와 - UI를 유지하기 위해, return false입니다