Déclenchement d'un draggable sur mousedown

Question

Ceci est mon problème. J'essaie de créer un événement pour déclencher un draggable. Voici ce que j'ai déjà essayé.

<div id="ecard-canvas"> 
    <div id="ecard-border"></div> 
    <img id="ecard-image" src="images/content/girl.jpg" alt="chick"/> 
</div> 

et le JS.

$('#ecard-image').draggable(); 

$('#ecard-border').mousedown(function(event){ 
    $('#ecard-image').trigger("mousedown.draggable", [event]); 
}); 

Mais biensur cela ne fonctionne pas l'événement se déclenche mousedown mais le mousedown.draggable n'est pas triggerd. Est-ce seulement possible? Qu'est-ce que je fais mal??

Answer 1

Eh bien, je l'ai résolu après plus de réflexion ici est mon code.

html

<div id="ecard-canvas"> 
    <div id="ecard-image-handle"></div> //absolute z-index:30 
    <div id="ecard-border"></div> //absolute z-index: 20 and has a nice background border set to it 
    <img id="ecard-image" src="yourimage" /> //relative z-index: 10 
</div> 

javascript

//get objects 
    oImage.obj = $('#ecard-image'); 
    oImage.handle = $('#ecard-image-handle') 

// set drag handler 
oImage.handle.draggable({ 
     addClasses: false, 
     drag: imageConstrain 
    }); 


//ondrag function 
function imageConstrain(oEvent, oUI){ 
    var newPosition = oUI.position; 

    oImage.obj.css({ 'left': newPosition.left, 'top': newPosition.top }); 
    return newPosition; 
};