jquery ui在容器內拖動滾動

我有一個無序列表，並使用jQuery UI可拖動的方式爲每個列表項添加了拖動功能。該列表位於id =「content」的div中。這是我的UL列表jquery ui在容器內拖動滾動

enter image description here

這裏的快照是我寫的代碼：

<script src="../../jquery-1.8.0.js"></script> 
<script src="../../ui/jquery.ui.core.js"></script> 
<script src="../../ui/jquery.ui.widget.js"></script> 
<script src="../../ui/jquery.ui.mouse.js"></script> 
<script src="../../ui/jquery.ui.draggable.js"></script> 
<script type="text/javascript"> 
$(function() { 
    $(".draggable").draggable({ 
     scroll: true, 
     scrollSensitivity: 100, 
     revert: true, 
     containment: '#content', 
     zIndex: 999990, 
     revertDuration: 100, 
     delay: 100 
    }); 
}); 
</script> 
<div style="width:200px;height:300px;overflow:auto;" id="content"> 
    <ul> 
    <li class="draggable">One</li> 
    <li class="draggable">Two</li> 
    <li class="draggable">Three</li> 
    <li class="draggable">Four</li> 
    <li class="draggable">five</li> 
    <li class="draggable">six</li> 
    <li class="draggable">Seven</li> 
    <li class="draggable">Eight</li> 
    <li class="draggable">Nine</li> 
    <li class="draggable">Ten</li> 
    <li class="draggable">Eleven</li> 
    <li class="draggable">Twelve</li> 
    <li class="draggable">Thirteen</li> 
    <li class="draggable">Fourteen</li> 
    <li class="draggable">Fifteen</li> 
    <li class="draggable">Sixteen</li> 
    <li class="draggable">Seventeen</li> 
    <li class="draggable">Eighteen</li> 
    <li class="draggable">Nineteen</li> 
    <li class="draggable">Twenty</li> 
     </ul> 
</div>

我希望做的是當我拖着任何容器內的列表項（即與ID =「內容」的div），當鼠標在div邊框或大小的邊緣，容器也應該滾動，以便我可以在容器內上下移動。

例如，如果我想拖動列表中的最後一個列表項目到列表中的第一個，所以當鼠標位於div邊緣的頂端時，容器（在我們的div中）也應該自動滾動。這是在jQuery UI可拖動的錯誤？請幫助

來源

2012-09-07 sonam

我一直在尋找jQuery UI演示頁面，但沒有那麼多的幫助，也搜索谷歌並沒有多大成功 – sonam

[jQuery.Drag]（http://javascriptmvc.com/docs.html#!jQuery.Drag）有一個[卷軸]（http://javascriptmvc.com/docs.html#!jQuery.Drag.prototype.scrolls）參數可用（在頁面上有一個演示）。也許看看代碼如何工作並將其實現爲jQuerys可拖動行爲？ –

這不是已經通過'scroll：true'處理過嗎？似乎已經在做你在Chrome中描述的至少http://jsfiddle.net/SqNx6/ –

嘗試降級到1.7.2的jQuery

（它不應該有1.8的工作但我認爲，你可以當你下載的jQuery UI找到RAR內的最新兼容版本）

來源

2012-09-12 14:54:23

它可能也是它與@James Montagne製作的小提琴一起工作的原因。 –

jquery ui在容器內拖動滾動

回答

相關問題