Có thanh trượt javascript (jquery) giới hạn các giá trị độc lập với các giá trị hiển thị không?

Question

Tôi muốn có một thanh trượt từ 0-100 nhưng chỉ có thể chọn từ 0-75 (ví dụ)

Một ví dụ sẽ giống như thế này, với thanh trượt bị giới hạn xâm nhập vùng màu

rõ ràng tôi muốn để có thể thiết lập tối đa, tối thiểu, hạn chế và giá trị của thanh trượt ...

theo như tôi có thể nhìn thấy jquery UI Slider không cho phép này ra hộp. Tôi hy vọng nó có thể mở rộng hành vi cơ bản nhưng tôi sẽ cần một nắm tay rất rõ ràng để làm cho công việc đó!

Answer 1

Bạn có thể sử dụng sự kiện slide của plugin trượt được kích hoạt trên mọi di chuyển chuột trong khi trượt. Sử dụng ui.value để lấy giá trị của xử lý hiện tại và kiểm tra giới hạn tối đa và trả về false. Trả lại false từ cuộc gọi lại này sẽ ngăn trang trình bày.

$(".selector").slider({ 
    slide: function(event, ui) { 
     if(ui.value > 75){//Note the value of ui.value is between 0 to 99 
      return false; 
     } 
    } 
}); 

Đối với màu nền của thanh trượt, bạn có thể dễ dàng đạt được nó thông qua css.