[ js ] 用jQueryUI的Droppable 不能自動排列
我希望用jQueryUI的droppable,把物件放在一個區塊內,可是當物件放進區塊之後
可以整齊排放
我目前的html
<a class="dragable" id="1">第一個連結</a>
<a class="dragable" id="2">第二個連結</a>
<a class="dragable" id="3" >第三個連結</a>
<div id="link_array" style="height:100px;width:50px;background:#ff0000"
>拖放的區塊</div>
js是這樣:
var $link = $('.dragable');
var $link_array = $('#link_array');
$link.draggable({
cancel: 'a.ui-icon',// clicking an icon won't initiate dragging
revert: 'invalid', // when not dropped, the item will revert back to its initial position
containment: $('#demo-frame').length ? '#demo-frame' : 'document', // stick to demo-frame if present cursor:
cursor:'move'
});
$link_array.droppable({
accept: '.dragable',
activeClass: 'ui-state-highlight',
drop: function(event, ui) {
getlink(ui.draggable); //把連結放在這裡做的動作
}
});
function getlink($item)
{
$(this).append($item);
}
請問該怎麼改才好
另外,我發現用這個的話,被宣告是dragable的物件會被jQuery加上一些css如:
position: relative;,有辦法拿掉嗎
謝謝回答
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 210.209.142.29
※ 編輯: knives 來自: 210.209.142.29 (03/23 13:38)
→
03/24 09:38, , 1F
03/24 09:38, 1F
→
03/24 11:19, , 2F
03/24 11:19, 2F