如何用Dreamweaver制作拖动效果

在网上，我们经常可以看到一些非常实用的拖拽效果，尤其是应用到网上购物的时候，访问者可以直接把选中的物品拖拽到购物盒子或者购物车里，非常方便有趣。但是大多数人不知道在Dreamweaver中使用行为也可以达到同样的效果。有兴趣的话，跟我来做一个拖拽效果的购物盒子吧！

在制作拖拽式网页之前，首先要准备一些图片。比如一张用作购物盒子或者购物车的大图，再加上几张代表物品的小图。我这里准备了一个购物袋，还有几件物品，分别是:手机，游戏垫，汽车(哇！汽车也可以拖进购物袋！)。

照片准备好了，我们可以开始工作了。打开Dreamweaver，创建一个新页面，在“对象”面板中选择“图层”工具，然后用鼠标在页面上拖动一个图层(或选择？插入/层？插入新层)。然后，把鼠标放到图层里，选择？对象/插入图像工具？，在这一层插入一张刚刚准备好的图。

重复上面的动作，然后插入三层，再在这三层中插入你准备好的其他几张图片。完成后，效果如图1所示。

图1

重要的一步来了。点击？窗口/操作？，会弹出来吗？行动？对话框，如图2所示。点击？在对话框的顶部。+?号码后会弹出一个菜单。选择？拖

层？，然后弹出来，就是？拖

层？对话框，如图3所示。

图2

在此对话框中，您可以分别设置几个层的属性。我们设置哪一层来插入购物袋图片？不可移动层(不可移动层)？，其余层都设置为？受约束？。这个对话框上还有一个？高级？选项，单击它，并在此面板上选中它？当...的时候

拖？选项，然后放？戒指

层

到

前面，然后呢？选项设置为？修复

z-index？去做吧。

图3

重复以上步骤，分别设置其他图层的属性，好吗？行为？对话框中间还有四个文本框？onLoad？马克。

好了，设置完这些，我们的工作就完成了。别忘了保存网页然后按？F12？关键，看你做的拖拽页面酷不酷？