jquery - 如何更改高亮效果的背景颜色？

Question

我有一个 jquery 移动滑块。

<input name="slider-1" id="slider-1" data-highlight="true"min="0" 
                                            max="100" value="50" type="range">

我想改变滑块轨道上高光填充的颜色？（默认为蓝色）。这是我的代码，但它不起作用

$("#slider-1").effect("highlight", { color: "#ff00ff" }, 3000);

谢谢

Answer 1

您使用了错误的选择器来更改滑块的默认颜色。

div.ui-btn-active这是对的

div.ui-btn-active{
    background: #ff00ff;
}

使用 jQuery，

$("div.ui-btn-active").css("background","#ff00ff");

检查这个小提琴

Answer 2

我认为CSS解决方案更好：

#slider-3::selection
{
    color:#ffffff;
    background-color:#ff0000;
}

#slider-3::-moz-selection   /* firefox*/
{
    color:#ffffff;
    background-color:#ff0000;
}

Answer 3

在这个 css 类中添加你的颜色代码，不要更改类名。

.ui-btn-active {
   background: linear-gradient(#5393C5, #6FACD5) repeat scroll 0 0 #5393C5;
   border: 1px solid #2373A5;
   color: #FFFFFF;
   cursor: pointer;
   font-family: Helvetica,Arial,sans-serif;
   font-weight: bold;
   text-decoration: none;
   text-shadow: 0 1px 1px #3373A5;
 }

Answer 4

使用.css它的属性并想用动画改变背景使用该animate功能。

 $("#slider-3").css("background-color","#ff00ff");

jQuery.css Documentation