jQuery滑块幻灯片上的默认灰色背景

我已经实现了jQuery滑块功能，当我滑动它时，它没有用默认灰色背景填充滑块。萤火虫的滑块后，我发现下面的一段HTML在我的实现中丢失了。要注意的是，与jQuery网站上的jQuery示例进行了比较。jQuery滑块幻灯片上的默认灰色背景

<div class="ui-slider-range ui-widget-header ui-corner-all ui-slider-range-min" style="width: 0%;"></div>

下面是已实施滑块的上下文。

的Javascript

$("#slider-range-min").slider({ range: "min", step: 100, //on slider-stop functionality stop: function(event, ui) { //code goes here }, //on slide functionality slide: function(event, ui) { //code goes here } });

HTML

  <div class="txtcenter"> 
       <div id="slider-range-min"></div> 
      </div>

问题：

这个HTML是由jQuery滑动库动态生成的吗？
其工作原理的解释。从我的例子

输出

<div id="slider-range-min" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all" aria-disabled="false"><a href="#" class="ui-slider-handle ui-state-default ui-corner-all" style="left: 38.5714%;"></a></div>

不含即使范围内自动生成的div类： “分钟” 已经被指定。

下面是一个链接，用滑动功能上的橙色背景替换默认灰色。

changing the color of a jquery ui slider as you slide it！

来源

2014-04-04 nata.inc

请发布您正在做的事情的完整代码示例，并在可能的情况下附带jsFiddle.net示例。 – j08691

做了一个小提琴，发现范围：“分钟”是似乎控制灰色背景的元素。 [jsfiddle]（http://jsfiddle.net/YHm42/） –

之前：在页面加载

功能负荷（）{（“＃slider-range-min”）。slider（{ range：“min”， disab led：true， }）; }

功能user_action（）{。 $（ “＃滑块范围-MIN”）滑块（{ 禁用：真， }）; }

后：上的用户动作触发

功能负载（）{ $（ “＃滑块范围-MIN”）滑块（{ 范围： “min” 是， disabled：true， }）; }

功能user_action（）{ $（ “＃滑块范围-MIN”）滑块（{ 范围： “min” 是，禁用：假，。}）; }

来源

2014-04-07 15:30:43

可以尝试把他在你的CSS文件（底部）

.ui-widget-header { 
background: #cccccc; 
}

，如果它不工作，你可以试试这个：（不优先停留）

.ui-widget-header { 
background: #cccccc!important; 
}

jQuery的

我认为你必须设置最小值，最大值。您现在使用getter作为最小值。除此之外，您必须创建两个手柄，只有一个手柄没有任何背景可用。

试试这个：

$("#slider-range-min").slider({ 
     range: true, 
     min: 0, 
     max: 500, 
     values: [ 75, 300 ], 
     slide: function(event, ui) { 

     } 
    });

见琴：http://jsfiddle.net/ZTeKC/

来源

2014-04-04 14:20:25 Mike

感谢您的回复，但问题在于默认的灰色背景，即使范围设置为“min”值，该灰色背景也不起作用。 –

你想要这样的东西吗？ http://jsfiddle.net/6sLt2/ – Mike

是的。原因在于范围是在滑块处于禁用模式时指定的，但在启用滑块时未设置。提供了一个示例代码以更好地理解解决方案。 –

基于JS和你只要woudl不行的HTML。

“$（”＃滑块范围分钟“）。滑块”正在寻找一个元素与“滑程敏” HTML中的id你上面提供的不具有ID。

是它会生成自己的HTML需要的就是给你一个滑块
其所有解释这里http://api.jqueryui.com/slider/

来源

2014-04-04 14:23:32

我提供的html确实有这个id。更确切地说，滑块功能工作正常，除了在滑动滑块时没有出现灰色背景。 –

jQuery滑块幻灯片上的默认灰色背景

回答

相关问题