Question

我有两种类型的div

<div class="target_div" id="t1">  </div>
<div class="target_div" id="t2">  </div>
<div class="target_div" id="t3">  </div>
<div class="target_div" id="t4">  </div>


<div class="child_div" id="c1">  </div>
<div class="child_div" id="c2">  </div>
<div class="child_div" id="c3">  </div>
<div class="child_div" id="c4">  </div>

使用Jquery，假设我想将c1放在t1上，以便它们的左上角始终匹配，我该怎么做呢？我希望c1坚持t1，无论如何...页面调整大小，滚动..在所有情况下。

我正在创建一个纸牌游戏，我想拖放并将牌从页脚放置并放置在编号为1-13的div中。因此问题。

在图片中，t1，t2 ......等是数字为1-13的div。 c1，c2等是位于页脚上的卡片。

Answer 1

只需使用CSS将卡设置为绝对位置，然后使用此脚本：

var offset = $('#t1').offset() //example
$('#c1').css({
    'top' : offset.top,
    'left' : offset.left
})

Answer 2

将position:relative;添加到target_div类。

当您在child_div中放置target_div时，将child_div元素移动为target_div的直接子元素（使用JavaScript＆amp; amp; DOM操作非常简单; JQuery like this），然后将position:absolute; top:0; left:0;添加到要移动的特定child_div。

如何将div粘贴在另一个div的顶部

2 个答案: