问jQuery双滑块处理重叠

EN

<div style='width: 510px; text-align: right; color: #000000; margin-top: 50px;'> 100 </div>
<div id='rail'> </div>
<div style='width: 500px; text-align: left; color: #000000; margin-bottom: 50px;'> 0 </div>

$( '#rail' ).slider({
      range: true,
      min: 0,
      max: 100,
      values: [ 50, 50 ],
      slide: function( event, ui ){  
          $('#upper_result').html(ui.values[0]); 
          $('#q160_1').val(ui.values[0]); 
          $('#lower_result').html(ui.values[1]); 
          $('#q160_2').val(ui.values[1]);
      }
 });

var lower = document.getElementById('rail').getElementsByTagName('a')[1];
var upper = document.getElementById('rail').getElementsByTagName('a')[0];

lower.style.cssText="left: 250px; top: 35px; background: url('http://media.jts-mr.com/CustomeQuestions/Classic Slider/lower_thumb.gif')";
lower.innerHTML = "<div class='result' id='lower_result' style='position: absolute; top: 22px;'>" + $( '#rail' ).slider( 'values', 1 ) + "</div>";
upper.innerHTML = "<div class='result' id='upper_result' style='position: absolute; top: -20px;'>" + $( '#rail' ).slider( 'values', 0 ) + "</div>";