jQuery UI可拖動的限制

Question

我想創建使用jQuery UI的可拖動滑動門的效果。 HTML是：

<div id ="home-elev-door" class="elev-door-wrap">   
     <div class="elev-door"></div> 
</div> 

我目前擁有的代碼是這樣的：

var elevWrap = $('.elev-door-wrap') 

$(function() { 
    $(".elev-door").draggable({ 
     cursor: 'pointer', 
     axis: 'x', 
     drag : function(event, ui) { ui.position.left = onDragElev(ui.position.left); }, 
     }); 
}); 

function onDragElev(left){ 
    if (left > 0) { left = 0; } 
    else if ((elevWrap.width()+left) < 27) { left = 27-elevWrap.width(); } 
    return left; 
} 

這是什麼基本上都被使我門滑向左側和背部設置了一個27px極限如何遠遠可以在父分區內拖動。但是，我想要做的是扭轉這種情況，以便限制僅在右側。我嘗試將所有「左」的實例更改爲「右」，但這似乎不起作用。相反，它直接拖出父母雙方。

任何幫助，這將不勝感激。提前謝謝了。

更新：我有一個js小提琴鏈接來幫助說明我的意思。希望它有幫助。 http://jsfiddle.net/metallikat79/RCGDH/

Answer 1

將其剔除。它只需要一行代碼來控制和傳遞一組座標作爲限制，即;

containment: [0, 0, 200, 0] 

這裏是我更新的工作例如鏈接JS小提琴： http://jsfiddle.net/metallikat79/RCGDH/2/