标签: jquery-ui-slider

好的,我想使用jQuery Slider元素控制HTML5元素的音量.我已经实现了幻灯片,但无法弄清楚如何使滑块的值取代"audio player.volume =？".

任何帮助深表感谢.

资源

$('#foo').slider({
  range: 'min',
  min: 0,
  max: 1000,
  step: 100,
  value: 500,
  create: function( event, ui) {
          var bar = ui.value;
  },
  //etc...
});

为什么不bar定义而不是500？是否有可能一个变量分配到value的create事件？

我想将Jquery滑块范围更改为RTL.我是这样的:http://jqueryui.com/slider/#range

Jquery代码:

    $(function() {
    $( "#slider-range" ).slider({
      range: true,
      min: 0,
      max: 1000000,
      values: [ 100000, 500000 ],
      slide: function( event, ui ) {
        $( "#amount" ).val(addCommas(ui.values[1])+ " ?????                " + addCommas(ui.values[0])+" ?????");
      }
    });
    $( "#amount" ).val( addCommas( $( "#slider-range" ).slider( "values", 1 ) )  + " ?????                " + addCommas( $( "#slider-range" ).slider( "values", 0 ) ) + "?????" );
  });

  function addCommas(nStr){
    nStr += '';
    x = nStr.split('.');
    x1 = x[0];
    x2 = x.length …

我有从代码更新滑块值的问题.我试过了

$('#slider').slider('value', newValue);
$('#slider').val(newValue).slider();
$('#slider').val(newValue).slider('refresh');

没有结果

任何其他建议

我正在使用jQuery滑块,用户可以在00:00和1d + 12:00之间选择时间范围.一共36个小时.无论如何.

我想根据它们设置的内容将最小值和最大值应用于我的句柄.这些是我的要求:

1. 左手柄在第二天不能超过午夜(最多24小时)
2. 左手柄永远不会比右手柄-24小时左右(最小值是右手柄值减去24小时)
3. 右手柄从左手柄开始不会超过+24小时(最大左手柄值加24小时)

据我所知,最小值和最大值只能应用于单个手柄滑块控件而不能应用于范围滑块？

是否可以单独设置两个手柄的最小值和最大值？

我试过用这种方式初始化它,但没有运气:

$(".timing-slider", timing).slider({
    range: true,
    min: [0, 0],
    max: [24, 36],
}

我有一个奇怪的请求,允许用户选择滑块上的范围,但允许它们反转滑块上的范围选择.例如,如果他们在滑块上有这个选择:

<---- [] ========== [] ---->

他们可以单击按钮并反转该选择.我们想像这样直观地显示它:

<==== [] ---------- [] ====>

然后滑块将继续按预期运行,但突出显示相反.我知道你可以用这个滑块做类似的事情,通过一个手柄设置固定的最大值或最小值,但不确定是否可以使用两个手柄.有谁知道这是否适用于jQuery UI滑块？

我已经创建了我的jquery价格滑块,但我不确定如何过滤我的结果,以便在您滑动时只能看到具有该范围值的产品.

HTML:

<div class="demo">

<p>
    <label for="amount">Price range:</label>
    <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;" />
</p>

<div id="slider-range"></div>
<ul>
        <li> product - £10 </li>
        <li> product - £50 </li>
        <li> product - £100 </li>
        <li> product - £150 </li>
        <li> product - £200 </li>
    </ul>
</div>?

JavaScript的:

$(function() {
    var options = 
        {
            range: true,
            min: 0,
            max: 500,
            values: [ 50, 300 ],
            slide: function( event, ui ) {
                $( "#amount" ).val( "$" + ui.values[ 0 ] + " …

我想要实现这样的事情:

从X元素中,我想选择"OK"的数字,数字或"部分正常"以及"不正常"的数量.显然,三个范围不是可叠加的,并且总和总是X.

我试图从标准的jQuery UI滑块开始,但主背景是独特的,因此我不能将绿色和红色一起使用.

有没有插件已经这样做了？或者对标准jQuery插件最简单的方法有什么想法？

我有一个jQuery滑块(实际上,它的自定义扩展)配备了slide事件的处理程序,当滑块被交互操作时,这个处理程序被正确调用,但是当我运行时

$("#slider").trigger("slide");

此命令运行时没有错误,但slide不会调用处理程序.

为什么是这样？

我是否需要传递一个不同的参数来触发slide才能调用处理程序？

编辑:改变帖子的标题,以更密切地反映问题的动机.

我创建了一个 jQuery 价格滑块，但我不确定如何让过滤区域以实际价格范围开始？目前它有“ $[object Object] - $[object Object] ”，而我希望它有“ $299 - $1099 ”之类的东西。一旦开始移动滑块选择器，对象引用就会被正确的价格替换，但我希望过滤区域从一开始就具有正确的范围。

HTML：

<div id="slider-container"></div>
<p>
<label for="amount">Price range:</label>
<input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
</p>
<div id="computers">
<div class="system" data-price="299">div1 -  299</div>
<div class="system" data-price="599">div2 -  599</div>
<div class="system" data-price="1099">div3 -  1099</div>
</div>
<div id="slider-range"></div>

JavaScript：

  $(function() {
    $('#slider-container').slider({
        range: true,
        min: 299,
        max: 1099,
        values: [299, 1099],
        slide: function(event, ui) {
            $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" …