jquery multi handle slider

I want make a multi-handle slider and image hanging with each handle

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<div id="slider"></div>
<table>
    <tr>
        <td>
            <label id="lableOne" for="one">
                one
            </label>
        </td>
        <td>
            <input id="one" type="text"></input>
        </td>
    </tr>
    <tr>
        <td>
            <label id="lableTwo" for="two"> two
            </label>
        </td>
        <td>
            <input id="two" type="text"></input>
        </td>
    </tr>
</table>

JavaScript

$("#slider").slider({
    min: 0,
    max: 100,
    values: [50, 50],
    slide: function (event, ui) {
        $("#one").val(ui.values[0]);
        $("#two").val(ui.values[1]);


    }
});