Question

我是jQuery的初学者，并想知道是否有人能指出我正确的方向。我想创建一个滑块，它将颜色从红色变为绿色，并记录分数。该值应从0开始，当用户向右滑动时，颜色变为红色，记录得分为-1。如果它向左滑动，颜色变为绿色并记录+1的分数。请帮忙。

JS：

$(function(){
   $( "#slider" ).slider({
      value:0,
      min: -3,
      max: 3,
      step: 1,
      slide: function( event, ui ) {
         $( "#score" ).val( ui.value );
      }
   });
   $( "#score" ).val($( "#slider" ).slider( "value" ) );
});

HTML：

<html>
<p>
  <label for="score">Rating (+/-1 increment):</label>
  <input type="text" id="score" />
</p>
<div id="slider"></div>
</html>

Answer 1

似乎设置了＆＃34;背景＆＃34; CSS属性做到了。这是你的意思：http://jsfiddle.net/UweCD/1/

    slide: function(event, ui) {
        $("#score").val(ui.value);
        $(this).css("background", ui.value>0 ? "green" : ui.value<0 ? "red" : "");
    }

应该足以让你开始......

使用jquery滑块以增量编号或减量编号更改框颜色

1 个答案: