[英]Triggering a draggable on mousedown
This is my problem i'm trying to create a event to trigger a draggable. 这是我的问题,我正在尝试创建一个事件以触发可拖动对象。 Here is what i already tried.
这是我已经尝试过的。
<div id="ecard-canvas">
<div id="ecard-border"></div>
<img id="ecard-image" src="images/content/girl.jpg" alt="chick"/>
</div>
and the JS. 和JS。
$('#ecard-image').draggable();
$('#ecard-border').mousedown( function(event){
$('#ecard-image').trigger("mousedown.draggable", [event]);
});
But offcourse this doesn't work the mousedown event fires but the mousedown.draggable isn't triggerd. 但是,这当然不起作用,但会触发mousedown事件,但不会触发mousedown.draggable。 is this even possible?
这有可能吗? What am i doing wrong??
我究竟做错了什么??
Well i solved it after some more thinking here is my code. 好了,经过更多思考之后,我解决了它,这是我的代码。
html 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 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;
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.