1． 在 dw 中新建一个空白文档（或者打开你要添加效果的页面）。
2． 设置好你自己的 css 风格。
3． 在页面上插入一个长 500pix 的表格（这里说明：插入表格的目的是为了控制层在不同分辨率下保持相对的位置不变，假如你的页面之前没有做相关设置，那么这一部你可能要费点功夫整理一下你的页面结构）。
4． 将光标置入表格内，点击菜单 [插入——层] 插入一个长 500 高 20 的图层，并命名为 layer1。
5． 然后再将光标置入图层 layer1，点击菜单 [插入——层] 再插入一个长 500 高 130 的图层 layer2；并将 layer2 的属性中左边距和上边距都设置为 0，并为它指定一个你喜欢的背景色。
6． 然后重复步骤 5 的方法，再插入一个图层 layer3，这个图层没什么非凡的用处，在我的这个教程中，我只不过是为了放置几个按钮而已。最后我的开起来如图：
TIPS：这里这么做的目的是为了给你要滑动的图层前面加一个挡板，只有当点击的时候图层才从你的这个图层下缓缓的滑动出来。
现在开始，才正式进入到我们今天要制作的滑动菜单的制作过程中。
1. 现在让我们再次重复上面的步骤 5，再插入一个图层 layer4, 设置图层属性为宽 500、150 高，刚好是刚才 layer2 和 layer3 的高度之和，并将图层 layer4 调整到另外两个图层下面。如图：
然后我们点击图层 layer2 前面的眼睛让他闭合，这样可以让我们看到它下面的图层 layer4.
2. 这时，我们点击 ALT F9 打开时间轴面板，DW 已经为我们添加了默认的时间轴 Timeline1，然后，我们选中我们要滑动的图层 layer4，在上面点击右键，选择 [添加到时间轴] 这时我们可以在时间轴面板中看到我们刚刚制定的图层 layer4，这说明，我们已经添加成功了！
3. 然后我们点击时间轴上的第 15 桢，将图层 layer4 的属性面板中的上边距调整为 150。到这里，一个能滑动的图层就算做好了，你可以拖动时间轴上面的红色方块慢慢从 1 走向 15，你就可以看到你的这个图层慢慢的从 layer2 和 layer3 下面滑动出来！
4. 好了，现在我们只需要给这个会滑动的图层 layer4 设置一个可以激活他的动作就算 over 了：）这之前，我已经在我添加的 layer3 上插入了一个表格，并为 layer4 设置了两个按钮。
5. 我们先设置激活滑动图层的动作。选择上展开这个按钮，转到行为面板，点击在出来的菜单中选择 [时间轴——播放时间轴] DW 会弹出一个窗体，在上面的下拉菜单中选择 timeline1。
然后在行为面板中确认事件为 onclick
好了，到这里，你可以预览一下，当你点击上展开按钮时，你的图层就会慢慢的从上而下滑动出来！
6. 怎么样，看到了吧：）我们再给图层添加上一个简单的关闭动作，就是点击关闭按钮后图层隐藏。选择上关闭按钮，转到行为面板，点击菜单中选择 [显示隐藏层]，在跳出的窗体中选择上 layer4，然后点击下面的隐藏按钮，将其设置为隐藏，如图：
7. 好了，再预览一下，发现展开后点击关闭图层就没有了：）不过，似乎有一个问题，再次点击展开的时候，似乎没什么反应了，那是我们还有一个动作没有设置。