谷歌Chrome的滾動條和jQuery用戶界面的可拖動的插件

Question

首先，例如：http://jsfiddle.net/Koviko/92PZZ/

在這裏，我使用jQuery UI的draggable插件，以便在容器被水平拖動。我還讓第二個子元素包含一個滾動條。問題是不同的瀏覽器以不同的方式處理這個滾動條的使用。我已經在IE8和Chrome和Firefox的最新穩定版本中進行了測試。

有兩個測試用例所需的行爲：

1. 點擊並按住卷軸上的鼠標和垂直移動，和
2. 點擊並按住滾動條的鼠標和水平移動。

第一個使用案例（垂直運動）：

IE8和Firefox：沒有問題。

Chrome：釋放鼠標按鈕後，移動鼠標將導致容器拖動鼠標光標。釋放容器需要將鼠標移出滾動條（位於容器外部的下方），然後嘗試拖動。

第二個用例（水平移動）：

IE8：水平拖動將導致沒有任何東西可移動。

Firefox：水平拖動會導致容器移動。

Chrome：水平拖動會導致容器移動，並且與垂直滾動一樣，釋放鼠標按鈕後不釋放拖動。它以同樣的方式清除。

---

所以，基本上，Chrome的行爲是問題。我會接受Firefox或IE8中的行爲。有沒有辦法從Chrome強制這種行爲？

Answer 1

這表現在這個小提琴：http://jsfiddle.net/FGXnR/

該解決方案在此給出答案：Using jQuery UI Draggable, how to avoid drag when using scrollbar?

基本上，使用handle: option指定一個具體的事情來拖動。