• I am trying to move all the three slider handle to the left side corner...one by one...but after I move the the first two sliders to the corner, the third does not move till the end of the corner

  What is the reason for this and how can I fix it?... can u pls help....

• i am using jquery ui

providing my code below... http://jsfiddle.net/5EfAP/51/embedded/result/

function iterator(ranges) { var values = [ ranges[0], ranges[1] - ranges[0], ranges[2] - ranges[1], 100 - ranges[2] ], matches = [], $sliderRanges = $('.slider-container .slider-rangebar'); $.each(ranges, function(index, value) { $sliderRanges.eq($sliderRanges.size() - index - 1).width(value + '%'); }); for (var i = 0; i < allProfile.length; i++) { var lineValues = allProfile[i].values; if ( (isInRange(values[0], lineValues[0], 10)) && (isInRange(values[1], lineValues[1], 10)) && (isInRange(values[2], lineValues[2], 10)) && (isInRange(values[3], lineValues[3], 10)) ) { matches.push(allProfile[i]); } } highlightMatches(matches); } function highlightMatches(matches) { var $profile = $('.profileContainer'), matchesIds = [], $highlights; $.each(matches, function(i, match) { matchesIds.push('#profile' + match.title); }); $highlights = $(matchesIds.join(', ')); $profile.not($highlights).css('opacity', 0.5); $highlights.css('opacity', 1); } function isInRange(value, target, margin) { return (value >= (target - margin)) && (value <= (target + margin)); }