Jquery ui drag and drop problem : drag sometimes lock in place instead of connecting

Jquery ui drag and drop problem : drag sometimes lock in place instead of connecting

Hi,

I have some problem with my drag and drop page. these are my first steps with jquery.

see it here: http://lifemayhem.com/ui/

If you drag some items at the bottom of the page into the custom calendar, the object will lock in place while being dragged, and will not necessarly lock into a specific timeframe on the agenda.

MY jquery ui code is the following:
 
  1. $(function() {
      $( ".box2" ).disableSelection();
      $( ".box2" ).sortable({ tolerance: 'fit' });
      $( ".box2" ).sortable({ connectWith: '.drag' });
     });


    $(function() {
     $(".drag").draggable( {
     connectToSortable: '.box2'
     
    }
     
     );
          
     
    });













Any help is appreciated. thanks in advanced