This is my first time using jQuery so I might be wrong on this one, but anyway:
When using 3 sliders (based on the 2 slider example):
<script type="text/javascript">
...
$(window).bind("load",function(){
h1 = $("#handle1");
h1.start = 10;
h1.value = 10;
h2 = $('handle2');
h2.value = 50;
h2.start = 50;
h3 = $('handle3');
h3.value = 120;
h3.start = 120;
$('#example3').slider({
minValue: 0,
maxValue: 200,
range: false,
handles: [h1,h2,h3],
slide: function(e,ui) {
...
ui.value is 100 even when slider is at max which should be 200.
after some debugging i found that ui.options.realMax.x = 100 still.
adding the following to adjust the realMax value at the top of slide
is a workaround for the bug: (and things start working propertly)
lo = new Object;
lo.x = 200;
lo.y = 200;
ui.options.realMax = lo;
includes:
<link rel="stylesheet" href="jquery.ui/themes/flora/flora.all.css" type="text/css" media="screen" title="Flora (Default)" />
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript" src="jquery.ui/jquery-1.2.4a.js"></script>
<script type="text/javascript" src="jquery.ui/ui.base.js"></script>
<script type="text/javascript" src="jquery.ui/ui.slider.js"></script>