gpt4 book ai didi

jQuery Draggable - 如何访问坐标

转载 作者:行者123 更新时间:2023-12-01 00:11:12 25 4
gpt4 key购买 nike

如何访问可拖动对象的动态变化坐标?我不只是想要 stop 的坐标,而是源源不断的位置信息流。

换句话说,如果我拖动 object A周围,​​我应该能够得到 object B通过 (1) 观察 object A 的变化来并行移动然后(2)将它们应用到 object B 的位置.

在此代码中,我希望红色 block ( obj2 ) 与蓝色 block ( obj1 ) 一起移动。

<html>
<head>
<style>
#obj1 {
position:fixed;
top:50px;
left:50px;
width: 40px;
height: 40px;
background-color: blue;
}
#obj2 {
position:fixed;
top:150px;
left:150px;
width: 40px;
height: 40px;
background-color: red;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(function () {
$('#obj1').draggable();
})
</script>
</head>

<body>
<div id="obj1"></div>
<div id="obj2"></div>
</body>
</html>

最佳答案

您可以使用draggable的drag事件:

$("#obj1").draggable({
drag: function(event, ui) {
var pos = ui.position;
$("#obj2").css({
left: pos.left + 100,
top: pos.top + 100
});
}
});​

演示: http://jsfiddle.net/kPEfL/

关于jQuery Draggable - 如何访问坐标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11061711/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com