jQuery ui slider handles

[OAFC_Rob]

I am trying to get the jQuery ui slider handles if dragged to meet, to keep a minimum distance apart of say 50, so it would look like 50 - 100 on a rnage from 0 to 200. I have done this with no problems really, but my next bit is a bit harder and I can't seem to find anything on the web that is helpful.

 

What I want to happen, if a user clicks and drags the first ui handle, the second will increment as well keeping that gap of 50 unless the range max value is met.

 

Here is the code I've got;

 

$("#priceRange").slider({
                            range: true,
                            min: 50,
                            max: 1000,
                            values: [50, 500],
                            step: 50,
                            slide: function(event, ui){
                                
                                priceMin = ui.values[0];
                                priceMax = ui.values[1];

                                if((priceMax-priceMin)<50){
                                    return false; 
                                }
});

 

And here is an exmaple I saw on a website, which makes me believe it is possible. http://www.allsaints.com/men/new/?WT.ac=ss12mens/

 

Please help me before I go insane!!

[OAFC_Rob]

Figured it out!