具有相反值的Jquery UI滑块？

Question

首先，我是jquery首发，所以请不要为我缺乏知识而生气。

我试图建立一个jQuery的滑块，有它在其宽度的确切一半开关，并与滑块，以特定的方式工作值两个输入：

如果移动滑块切换到左侧，#first输入中的值递减，#second中的值递增。对于右侧它扭转局面。所以如果我移动滑块向右和#second箱变（例如）值30，#first获得价值70

我希望你明白我的需要..

直到现在我已经设法在滑块和#first投入中获得开关会从滑块

价值，我不知道如何从这里

您可以查看和修改情况搬到这里：http://jsfiddle.net/M8AWg/

HTML：

<div class="container"> 
    <input type="text" id="first"/> 
    <input type="text" id="second"/> 
    <div id="slider"></div> 
</div> 

JS：

$('#first, #second').val('50'); 

$(function() { 
    $("#slider").slider(
    { value: 50, 
     slide: function(event, ui) { 
      $("#first").val(ui.value); 
      $(ui.value).val($('#first').val()); 
      }  
     } 
    ); 
    }); 

Answer 1

是总总是100？如果是的话你可以加入这一行：

$("#second").val(100 - ui.value); 

在这里看到：

http://jsfiddle.net/M8AWg/1/

Answer 2

从滑块使用的价值，减去100，让您的其余部分。 也$(ui.value)要寻找$(30)不存在

$(function() { 
    $("#slider").slider(
    { value: 50, 
     slide: function(event, ui) { 
      $("#first").val(ui.value); 
      $('#second').val(100-ui.value); 
      }  
     } 
    ); 
    }); 

fiddle