谷歌Chrome滚动条和jQuery UI可拖动插件

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指定要拖动的特定内容。