a-z索引_拖放Z索引堆叠

a-z索引

In an example for a previous post, I showed you how to use opacity during a drag'n'drop transaction. One bit I didn't account for was element stacking and bringing the most recent element to the top of the stack. To do so, we'll need to use a variable that represents the highest zIndex, which we'll be incrementing.

在上一篇文章的示例中，我向您展示了如何在拖放事务期间使用不透明度 。 我没有考虑的一点是元素堆叠并将最新的元素带到栈顶。 为此，我们需要使用一个代表最高zIndex的变量，我们将对其进行递增。

View Demo 观看演示

MooTools JavaScript (The MooTools JavaScript)

window.addEvent('domready',function() {
	var zIndex = 2;
	$$('.draggable').each(function(el) {
		var drag = new Drag.Move(el,{
			grid: false,
			preventDefault: true,
			onStart: function() {
				el.setStyle('z-index',zIndex++); //increment!
			}
		});
	});
});

View Demo 观看演示

As you probably expected, the process is as simple as it gets. Correct stacking order is incredibly important as you don't want items to be wrongly buried.

如您所料，该过程非常简单。 正确的堆叠顺序非常重要，因为您不希望物品被错误地掩埋。

翻译自: https://davidwalsh.name/drag-drop-stacking

a-z索引