jQuery UI 슬라이더에 스냅 추가하기, 애니메이션 유지하기

Question

타임 라인과 유사한 컨텐츠 스크롤러를 설정하여 5 년 동안 수평 슬라이더를 만들었습니다.

그들 사이에 스냅을 추가하고 싶습니다. 이 작품은, 비록 지금은 애니메이션이 하나에서 다른 슬라이딩 보이지 않습니다. 점 사이의 스크롤 애니메이션과 스냅을 모두 어떻게 사용합니까?

이 내 jQuery를 조각입니다 :

//build slider 
    var scrollbar = $(".scroll-bar").slider({ 
     value: 10, 
     min: 0, 
     max: 100, 
     step: 25, 
     slide: function(event, ui) { 
      if (scrollContent.width() > scrollPane.width()) { 
       scrollContent.css("margin-left", Math.round(
        ui.value/100 * (scrollPane.width() - scrollContent.width()) 
       ) + "px"); 
      } else { 
       scrollContent.css("margin-left", 0); 
      } 
     } 
    }); 

Answer 1

slide: function(event, ui) { 
     if (scrollContent.width() > scrollPane.width()) { 
      scrollContent.animate({ 
       "margin-left": Math.round(ui.value/100 * (scrollPane.width() - scrollContent.width())) 
      }, 20); 

     } else { 
      scrollContent.animate({ 
       "margin-left": 0 
      }, 20); 
     } 
    }