Chrome bug in jQuery UI sortable
With the body overflow style set to 'auto', Chrome has a bug in the sortable widget. When set to 'inherit', this bug disappears, although the sorting is noticeably slower under Chrome and FF.
by TJ VanToll
HTML
<link href="http://code.jquery.com/ui/jquery-ui-git.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-git.js"></script>
<script src="http://code.jquery.com/ui/jquery-ui-git.js"></script>
<div id="sortable">
<div>Item 1</div>
<div>Item 2</div>
<div>Item 3</div>
<div>Item 4</div>
<div>Item 5</div>
<div>Item 6</div>
<div>Item 7</div>
<div>Item 8</div>
<div>Item 9</div>
<div>Item 10</div>
<div>Item 11</div>
<div>Item 12</div>
<div>Item 13</div>
<div>Item 14</div>
<div>Item 15</div>
<div>Item 16</div>
<div>Item 17</div>
<div>Item 18</div>
<div>Item 19</div>
<div>Item 20</div>
<div>Item 21</div>
<div>Item 22</div>
<div>Item 23</div>
<div>Item 24</div>
<div>Item 25</div>
<div>Item 26</div>
<div>Item 28</div>
<div>Item 29</div>
<div>Item 30</div>
<div>Item 31</div>
<div>Item 32</div>
<div>Item 33</div>
<div>Item 34</div>
<div>Item 35</div>
<div>Item 36</div>
<div>Item 38</div>
<div>Item 39</div>
<div>Item 40</div>
<div>Item 41</div>
<div>Item 42</div>
<div>Item 43</div>
<div>Item 44</div>
<div>Item 45</div>
<div>Item 46</div>
<div>Item 48</div>
<div>Item 49</div>
</div>
CSS
html { height: 100%; }
body { min-height: 100%; }
body { overflow: auto; }
#sortable { float: left; }
JavaScript
$( "#sortable" ).sortable();