jquery 또는 css를 사용하여 슬라이더의 배경색을 변경하는 방법

Question

슬라이딩 할 때 jquery와 css를 사용하여 슬라이더의 배경색을 어떻게 바꿀 수 있습니까?

제가

방법

.ui 슬라이더 범위 사용한

{배경 : colorName를};

Answer 1

도움이되기를 바랍니다.

이 예제의 demo도 있습니다.

$(document).ready(function() { 
    $('.slide').slider({ 
     slide: function(event, ui) { 
      // from pure red to pure green 
      var r, g, b = 0; 
      g = Math.round(255/100 * ui.value); // 2.55 * (0 - 100) = 0 - 255 
      r = 255 - g; 
      var color = 'rgb(' + r + ',' + g + ',' + b + ')'; 
      $(this).css({ 
       'background': color 
      }); 
     } 
    }); 
}); 

어딘가에 색상 선을위한 알고리즘을 찾을 수 있습니다 .-)이 부분을 방금 작성했습니다.

p.s. 데모에 다른 "알고리즘"을 추가했습니다 .-

Answer 2

유용 할 수 있습니다. 그것은 CSS를 변경하려면 JQuery를 사용하고 있습니다. 제 경우에는 슬라이더가있는 실제 DIV에서 CSS를 설정하려는 모든 시도가 실패 했습니까? JQuery CSS 라이브러리가 우선시되는 것 같군요? 과도하게 죽이는 것처럼 보입니다. 그러나 이것은 나를 위해 일했습니다.

var cs_style = "<style>#your_slider_div .ui-widget-header { background: #7D1515; } </style>"; 
    $('html > head').append(cs_style); 

위에서 실행하면 슬라이더에 대한 jQuery 함수 (정의 및 호출)가 배경색을 진한 빨간색으로 설정합니다. 물론, 당신이 원하는대로 설정할 수 있습니다. 너트를 깰 수있는 방법은 여러 가지가 있니?