Question

我有一个可拖动的容器，可以容纳不同数量的孩子与display: inline-block并排显示。我希望收容是基于第一个或最后一个孩子的偏移量，因此用户可以在任一方向上拖动除了一个（第一个或最后一个）屏幕外的所有内容。

drag: function(){//prevent dragging once last element offset is within 10% of window width
  if ($('.element:last').offset().left < $(window).width() * .10)){
    return false;
  }
}

问题是，一旦我返回假，我就再也无法拖延了。遏制的一些变化似乎是这里唯一的选择，但我不太确定如何喂它如此复杂的条件。

Answer 1

我最终做的是将所有内容放在一个传递给draggable方法的对象中。一旦我有了对象，我可以在孩子的位置发生变化时更新包含属性。设置完成后，我可以重新初始化draggable。

var borg = {
  axis: 'x',
  drag:function(){}
}
$('#draggable').draggable(borg);
//set property after each time the child offset changes
borg.containment = [
  -1 * ($('.child:first').offset().left + $(window).width() * .18), //x1
  0,          
  $(window).width()/2, //x2
  0
];
//reinitialize
$('#draggable').draggable(borg);
//would $('#draggable').draggable('destroy').draggable(borg) be better or unnecessary?

包含基于其子项之一的偏移量的可拖动元素

1 个答案: