我正在使用 jQuery Slider 选项。
JSFIDDLE
彩色条
$('.ui-widget-content').css('background','green');
所以,我可以像上面那样为条形图着色,这很好,但都是一种颜色。
但是,我想要实现的是栏上有不同的颜色,所以在这个例子中。
当值在 0 到 30 之间时,条形将被着色,在 30 到 70 之间为橙色,在 70 到 100 之间为绿色。
结果将是一个带有红色、橙色和绿色的条, slider 将移过该条。
这可能吗?
使用线性渐变提供的答案是我所需要的,但客户端正在使用 IE8。
最佳答案
您可以在背景中使用线性渐变来实现此目的:
$('.ui-widget-content').css('background','linear-gradient(to right, red 30%, orange 30%, orange 70%, green 70%, green 100%)');
这是浏览器对线性渐变的支持:http://caniuse.com/#feat=css-gradients
关于jQuery Slider - 栏上可以有不同的颜色吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27948262/