拖动时定位div
拖动时定位div
提问于 2013-06-15 16:18:50
我有一把小提琴：http://jsfiddle.net/eDyHf/1/
$("#ninjaimage1").draggable({
containment: "#cirlce1",
stop: function (event, ui) {
$("#cirlce1").animate({
top: $(this).offset().top,
left: $(this).offset().left
});
}
}); 我的问题是，当我在div中拖动图像时，我希望图像始终保持在div的中心，我该如何实现这一点？
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-06-15 16:33:43
这就是你要找的吗？(否则，您必须为您的问题提供更准确的解释！)
http://jsfiddle.net/u4CBW/
只需将+60添加到值即可正确更改圆的位置：
$("#cirlce1").animate({ top: $(this).offset().top-60, left: $(this).offset().left-60 });Stack Overflow用户
发布于 2013-06-15 16:23:19
为什么不在内部添加两个div，而只将拖动事件附加到外部(圆形)？然后它将始终保持在中心位置，不需要在javascript中花费太多精力，如下所示：
http://jsfiddle.net/2ebnz/
HTML：
<div id="field">
<div id="cirlce1" class="circlle">
<img id="ninjaimage1" class="Ninjaimg" src="http://www.boursematch.com/assets/images/avatar_default.gif"></img>
</div>
</div>CSS：
.Ninjaimg {
position:relative;
margin-top: 60px;
margin-left: 60px;
width:30px;
height:30px;
display:block;
cursor:pointer;
z-index:3000;
}
.circlle {
position: absolute;
width: 150px;
height: 150px;
-moz-border-radius: 50%;
border-radius: 50%;
border:1px solid black;
position: absolute;
z-index:1;
display:block;
}JS：
$(document).ready(function () {
$("#cirlce1").draggable();
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/17121585
复制相关文章
相似问题
腾讯云开发者
