用Dreamweaver制作拖拽效果

　　在网上，我们经常能够看到一些很实用的拖拽效果，特别是应用于网上购物时，访问者直接就能够把选中的物品拖拽到购物箱或购物车里，很方便、有趣。但是大多数人不知道，其实用Dreamweaver中的Behaviors也能够做出同样的效果来。假如您有兴趣，就和我一起来制作一个具备拖拽效果的的购物箱吧！

　　在做拖拽效果的网页之前，首先我们要准备一些图片。比如用作购物箱或购物车的一张

　　大图片，外加几张代表物品的小图片。我在这儿准备了一个购物袋，更有几样物品，他们分别是：手机、游戏手柄和汽车。

　　准备好了图片，就能够开始我们的工作了。打开Dreamweaver，新建一个页面，在对象面板中选择图层工具，然后用鼠标在页面上拖出一个图层来(或选择“Insert/Layer”，插入一个新层)。然后，把鼠标放进层中，再选择“对象/插入图像工具”，在此图层中插入刚才准备好的一个图片。

　　重复上面的动作，再接着插入3个图层，然后在此3个图层中分别插入您准备好的另外几张图片。

　　

　　好了，重要的一步来了。点击“窗口/动作”，会弹出“动作(Behaviors)”对话框来。点击对话框上方的“ ”号后，会再弹出一个菜单，选择此菜单中的“Drag Layer”，接着再弹出的，就是“Drag Layer”对话框了。

　　

　　重复上述步骤，分别配置好其他几个图层的属性，配置好的“Behaviors”对话框的中间文本框中多出了4个“onLoad”标记。

　　好了，配置完这些，我们的工作也完成了，别忘了保存网页，然后按下“F12”键，看看您做的拖动页面酷不酷？

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有