在某些电子商务网站上，经常会见到把商品用鼠标直接拖拽到购物车中的情形。在某些在线游戏网站，偶尔还会玩一些拼图游戏等。这些效果可以用Dreamweaver实现。这些使用鼠标拖拽对象的行为在Dreamweaver中就称之为Drag Layer。使用这个动作的时候，可以规定浏览者用鼠标拖拽对象的方向，浏览者要将对象拖动到的那个目标，并且，如果这个对象处于目标周围一定的坐标范围内，还可以自动地依附到目标上。更神奇的是，当对象到达目标时，可以规定将要发生的事情。下面讲解下使用Drag Layer动作的全过程。

首先选择工具面板中的层按钮，插入一个新层，并在层中插入一个对象。确保不选中这一层，然后点击行为面板中的+号，从中选择Drag Layer，将弹出对话框。这个对话框有两个标签，分别是Basic和Advanced，在标签Basic中，作如下设置：1、选定将要被拖拽的层名称。2、Movement：它有两个选项，Unconstrained和Constrained。前者的意思是用户的鼠标拖拽不受任何限制。如果选择后者，则限制了鼠标拖拽的范围。通过在Up、down、left、right中键入坐标值，确定鼠标拖拽的区域。3、Drop Target：设定拖拽层的目标位置的坐标值。4、Snap If Within设定了可拖拽的那一层处于距离目标多远的范围内，如果在范围内，则自动依附到目标的位置上。

如果想在被拖拽的层到达一个目标后，导致某种行为的产生，比如，在购物网站中， 将物品拖至购物车后，告知用户订购成功的信息。这种情况下，就需要设置Drag Layer动作对话框中Advanced标签的内容，1、Drag Handle：①如果选择Entire Layer，则鼠标可以拖拽层的任何部位。②如果选择Area within layer则只有在这一层被设定范围内的部分可以导致鼠标拖拽动作的发生。这时，需要设置顶端、底端、左端、右端的位置值。2、While dragging：如果选中了这个复选框，在鼠标拖拽时，都将出现在所有层的最上方。3、Call javascript：在鼠标拖拽层的过程中，可以调用javascript函数。比如，可以告诉浏览者一些诸如“你距离目的地还有多远”之类的信息。（5）When dropped：当鼠标拖拽层之后，释放层时，调用javascript函数。（6）Only if snapped：如果选中这项，则仅当层已经被拖拽到设定的目标位置时，才调用javascript函数。

按照上面讲解的各选项设置的用法，可以轻松地按照每个人所希望的设置完成。这时，在浏览器中打开页面，就可以欣赏到作品了。