JQuery JavaScript Tutorial





  jQuery UI Sortable - Default functionality
  
  
  
  
  
  
  #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.4em; height: 18px; }
  #sortable li span { position: absolute; margin-left: -1.3em; }
  
  
  $(function() {
        var sortOpts = {
          helper: helperMaker
        };
        
        function helperMaker(e, ui) {
          
          return $("
").css({
            border:"4px solid #cccccc",
             opacity:"0.5"
          });
        }
  
      
        $("#sortable").sortable(sortOpts);
  });
  




  Item 1
  Item 2
  Item 3
  Item 4
  Item 5
  Item 6
  Item 7