如何将可拖动的拖放到gridster中

时间:2012-12-23 03:41:56

标签: jquery drag-and-drop draggable gridster

有谁知道是否可以将可拖动元素放入gridster? http://gridster.net/#documentation

这对我的目的来说似乎很棒,但是你可以通过删除它们将它们添加到网格中吗?

我想将图片拖到gridster中。有可能吗? 我可以看一下这个样本吗?

如果无法做到这一点,您知道其他选择吗?

我需要将图像拖动到div内的离散位置,并能够保存位置以及在画布内移动图像。

1 个答案:

答案 0 :(得分:4)

你绝对可以做到。它只是声明可拖动和可拖放元素的问题。这个jsfiddle会给你一个想法。

 $(".gridster ul").gridster({
    widget_margins: [5, 5],
    widget_base_dimensions: [50, 50]
});

var gridster = $(".gridster ul").gridster().data('gridster');
$("#draggable").draggable();
$(".gridster ").droppable({
    drop: function (event, ui) {
        $("#draggable").removeAttr("style");
        gridster.add_widget(
       '<li class="new">
           <img src="http://www.sparity.com/images/facebookIcon.jpg" alt="facebook"> 
        </li>', 1, 1);

    }
});