4
검도 슬라이더를 사용하고 있습니다. 내 요구 사항은 모든 슬라이더 값 변경에 대해 검도 슬라이더 배경색을 변경해야한다는 것입니다. 슬라이더의 배경을 변경하려면검도 슬라이더 배경색?
검도 슬라이더를 사용하고 있습니다. 내 요구 사항은 모든 슬라이더 값 변경에 대해 검도 슬라이더 배경색을 변경해야한다는 것입니다. 슬라이더의 배경을 변경하려면검도 슬라이더 배경색?
, 당신은 같은 작업을 수행 할 수 있습니다
내가0
및
100
과 전류 값을 읽을
change
핸들러를 정의 사이 값으로 슬라이더를 정의하는 했는가
$("#slider").kendoSlider({
orientation: "vertical",
min: 0,
max: 100,
smallStep: 1,
largeStep: 20,
showButtons: true,
change: function (e) {
var top = $("#slider").closest(".k-slider-wrap");
if (e.value < 33) {
$(".k-slider-track", top).css("background-color", "#ff0000");
$(".k-slider-selection", top).css("background-color", "#ff0000");
} else if (e.value < 66) {
$(".k-slider-track", top).css("background-color", "#00ff00");
$(".k-slider-selection", top).css("background-color", "#00ff00");
} else {
$(".k-slider-track", top).css("background-color", "#0000ff");
$(".k-slider-selection", top).css("background-color", "#0000ff");
}
}
});
(e.value
) 값에 따라 슬라이드의 배경을 정의하십시오.
중요한 점은 다음과 같습니다
k-slider-selection
는 선택한 슬라이드의 부분에 대한 CSS 클래스입니다.k-slider-track
은 전체 슬라이드의 CSS 클래스입니다.예 : 값이 33 인 경우, 전체 범위 (0-100)
k-slider-track
제가 동일한 문제가 있지만 I 한 페이지에 복수의 슬라이더를 가지고있는 동안 0-33 용 슬라이더 부분k-slider-selection
이다. 클래스 선택기를 사용하는 동안 솔루션에 따라 모든 슬라이더의 색상이 변경됩니다. 변경 이벤트를 발생시킨 슬라이더의 색만 변경할 수 있기를 원하십니까? – haroonxml네, 클래스 선택기를 사용하고 있지 않습니다 **하지만'$ ("# slider")와 가장 근접한 (". k-slider-wrap")''top ' # slider'. – OnaBai
네, 맞습니다. – haroonxml