title: Jquery sortable drag and drop not showing 'move' cursor
body: <p>Im using this .sortable function on my list. My problem is that I want it to show the move cursor when the drag and drop is being used, and the pointer cursor only on hover. I have my css calling the cursor:pointer on hover, but it does not seem to show the move cursor at all. Everything else works fine. Code below.</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
      &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
      &lt;head&gt;
      &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js"&gt;&lt;/script&gt;
      &lt;link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.3/themes/base/jquery-ui.css" type="text/css"/&gt;
      &lt;link rel="stylesheet" href="blah.css" type="text/css" /&gt;
      &lt;script type="text/javascript" charset="UTF-8"&gt;
      $(document).ready(function()
      {
      $("#sortable").sortable({
          /*helper: 'clone', Tried this =(*/
          distance: 5,
          delay: 300,
          opacity: 0.6,
          cursor: 'move',
          update: function() {}
      });
      });
      &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
      &lt;ul id="sortable"&gt;
          &lt;li class="ui-state-default"&gt;Item 1&lt;/li&gt;
          &lt;li class="ui-state-default"&gt;Item 2&lt;/li&gt;
          &lt;li class="ui-state-default"&gt;Item 3&lt;/li&gt;
      &lt;/ul&gt;
      &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>
  
  <p>Seperate css doc contains:</p>
  
  <pre><code>#sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
  #sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.1em; line-height: 18px; height: 18px; }
  #sortable li span { position: absolute; margin-left: -1.3em; }
  
  /* HERE'S THE IMPORTANT STUFF! */
  #sortable li:hover {
      cursor: pointer;
  }
  
  #sortable li.ui-sortable-helper {
      cursor: move;
  }
  </code></pre>
  
  <p>Any help would be greatly appreciated. Thanks in advance. =)</p>
  
  <p>Perhaps a little more information. Its a db populated list from a while statement. each list item is a link, so I want it to display the {cursor: Pointer;} option. But when it is dragged i need it to display the {cursor: move;}. I would have thought that the code above would do it but its not working. I confused myself with the first post so thought i would clarify this a little better.</p>