While I have hundreds of draggables, the performance is very
So I want to hear from you if its possible to write code around it.
Have you devs a solution to create a draggable on the mousedown

The problem I face now, is: that I can create on the mousedown a
draggable, but it wont following my mouse. If I reclick it, then it
follows my mouse.

Currently I have the following not working code:

<!DOCTYPE html> 
  <link type="text/css" href="http://jqueryui.com/latest/themes/base/ 
ui.all.css" rel="stylesheet" /> 
  <script type="text/javascript" src="http://jqueryui.com/latest/ 
  <script type="text/javascript" src="http://jqueryui.com/latest/ui/ 
  <script type="text/javascript" src="http://jqueryui.com/latest/ui/ 
  <style type="text/css"> 
    #draggable { width: 100px; height: 70px; background: silver; } 
  <script type="text/javascript"> 


        $(".drag").mousedown( function(event){ 

            $("#draggable").trigger("mousedown.draggable", [event]) 

<body style="font-size:62.5%;"> 

<div id="draggable" class="drag">Drag me</div> 


How to deal with this problem, can you suggest something for me?

Nobody have experiences with this?

Since you're not adding the draggable behavior until someone clicks on it you won't be able to actually drag it until you release and click again.

Place the .draggable() call in your $(document).ready() function. You don't need to explicitly trigger the event either. That's what the draggable behavior does.