javascript - 如何禁止gridster向下移动小部件元素

Question

所有板都由小部件填充，没有边距。当我尝试将元素从一列（1）移动到另一列（2）时，第 2 列的元素就会像下面这样从板子上掉下来：

如果列中没有小部件的位置，我想禁止将小部件放置到某个位置。

我的代码：

   gridster = $(".gridster > ul").gridster({

          widget_margins: [mySizeDetector.blockMargin, mySizeDetector.blockMargin], 
          widget_base_dimensions: [mySizeDetector.dx, mySizeDetector.dy], /*[width, height]*/
          min_cols: mySizeDetector.xCount,
          min_rows: mySizeDetector.yCount,
  }).data('gridster');

提前致谢！

Answer 1

我认为您可以将其限制在x-axis超出容器的范围内，但不能限制在y-axis中。

因为我们有min_cols并且max_cols限制它在x-axis。但是我们只有 min_rows而不是 max_rows.

您可以参考文档： http: //gridster.net/#documentation

Answer 2

看看 Dustin Moore 的gridster 前叉。下载 .js 和 .css 文件。

摘自链接：

与拖动的小部件（播放器）相比，尺寸更小或相同的小部件将与原始小部件交换位置。

这会导致瓷砖左右交换以及上下交换。

默认情况下，较小的播放器会将较大的小部件向下移动。

我添加了一个选项来防止这种行为：

    $.gridster({
        shift_larger_widgets_down: false
    });