Question

我创建可拖动，可调整大小的图片，并希望最后一个拖动（如果可能的话，点击）在顶部。每个div都有自己的id，并且都有类'矩形'。

使用类“.selector”的jQuery示例initiazies：

$( ".selector" ).draggable({
  stack: ".products"
});

我用他们的id初始化我的

$(boxId).draggable({
    stack:".rectangle",
    containment: "parent",
    snap:true,
    snapTolerance: 6,

    .
    .
 });

它不起作用。所以我用Google搜索了问题并尝试了另一种方式

stop: function (event, ui){
    $(ui.element).css({'z-index': 2000});
}

我知道如果它起作用我将不得不使用增量变量而不是2000但是也不起作用。请帮忙。

Answer 1

如果您希望最后点击（拖动）的图片位于顶部，您可以在mousedown事件中更改其Z-index，如下所示：

$('.rectangle').mousedown(function() {
  var max = 0;
  $('.rectangle').each(function() {
    var z = parseInt($(this).zIndex(), 10);
    max = Math.max(max, z);
  });
  $(this).zIndex(max + 1);
});

或者你可以使用draggable的开始事件：

$('.rectangle').draggable({
  start: function( event, ui ) {
    var max = 0;
    $('.rectangle').each(function() {
      var z = parseInt($(this).zIndex(), 10);
      max = Math.max(max, z);
    });
    $(this).zIndex(max + 1);
  }
});

如何在id而不是类上使用jQuery draggable stack选项

1 个答案: