DW图层高级应用经典分析.txt如果青春的时光在闲散中度过，那么回忆岁月将是一场凄凉的悲剧。杂草多的地方庄稼少，空话多的地方智慧少。即使路上没有花朵，我仍可以欣赏荒芜。
1  DW图层高级应用经典分析
在网页设计中，用来定位内容的元素大抵包括表格和图层两种，其中表格大家一定经常看到了，
并且在网页的整体布局中它的使用应该是最广的，比较起来图层则更具灵活性，操作起来更方便，
比如图层除了象表格一样可以设定背景，位置外，还可以自由移动，响应事件，控制显示等，因此在局部处理中图层的作用是不容小觑的，熟练使用他们以后，一定能给你的网页增不少。
下面是一些经典应用。特写出来与大家共同分享。
一、利用图层隐藏不可见内容
作网页时，可能经常需要一些元素或是内容在网页载入时，或是始终不显示出来，
这时应用图层来处理应该是最明智的选择了，点击对象（Object）面板中的图层layer按钮插入新图层到指定的位置，此时鼠标会自动变成\"+\"形状，拖拽完成即可.
dw滚动文字代码
然后将隐藏的内容放到图层中，需要隐藏时，在图层边角位置单击以选中它,
调整相应的属性板上\"Vis\"为\"Hidden\"，现在该图层已经看不到了,
并且在原来位置上已经不能通过鼠标探测到了，重新定义必须点击网页
最上方的对应黄方块才能使它显示出来.
图层隐藏比较典型的应用就是\"计数器作弊\"了，对一些访问量比较小的个人网站来说,
确实是受益匪浅，当然本人并不提倡大家使用这种方法.
二、路径移动图层的制作
路径移动图层即在网页中按照指定路径（可以是任意的曲直线类型）移动的图层对象，
现在比较多的用于网页广告显示，在DW中移动路径的确定和调整是通过
配合时间轴（TimeLine）完成的。
1，点击Object中图层按钮，在路径的起点位置拖拉插入new layer，
并在图层中插入需要移动显示的内容，这里以一图片为例.
2，标定图层为选中状态，点击快速启动板中的TimeLine按钮,
默认情况下在DW4的启动板中可能不到TimeLine对象,
这时可以通过菜单\"Window\"-\"TimeLine\"调出时间轴编辑窗口,
右键点击时间轴第一桢(即红镜头方块所在的位置),
在弹出菜单中选\"Add Object\"，此时会自动产生15桢的移动长度,
将镜头移到15桢的位置，拖拽图层到路径的终点位置释放,
这时一个简单的移动路径就完成了.
3，如果你注意的话，会发现上面的移动路径是一条两点间的直线,
那么怎样建立符合要求的平滑曲线路径呢?
在TimeLine中改变路径形状是通过添加关键桢(keyframe)实现的,
在需要添加keyframe的位置右击选\"Add Keyframe\"选项,
同时向指定方向拖动图层对象，这时路径已经弯曲了.
如果想建立更复杂的曲线路径可以加入多个keyframe.
4，改变两点之间的frame的数目可以调整图层的移动速度,
操作上只需拖拉TimeLine上代表桢的\"空心或实心圆圈\"即可.
通过上面的例子，你已经能够建立合适的移动图层了，不过考虑到实际情况,
图层在移动中可能会挡住访问者想要浏览的内容，这时利用前面讲的\"可拖拉图层\"的
创建就可以很好的解决这一弊端了，另外你还可以为图层添加更多的鼠标事件.
三、制作复杂下拉菜单
在网页中使用下拉菜单可以极大的节省网页空间，并能够使内容的分类显示更具条理性，下面以一个典型下拉菜单的制作过程为例说明一下，其中需要注意的是这里的事件激活
对象不再是图层，而是相应的超级链接文字，当然你还可以根据实际需要换成图片或是
其他的对象.
1，首先建立3个主菜单项目，分别赋予对应的链接指向，然后在每个链接下面放置一个图层对象,
在图层中放入需要显示的子菜单内容，命名分别为caidan1,caidan2,caidan3，注意对应一定要
整齐否则会影响以后的显示效果，关于具体的制作就不说了，完成后的效果如图.
2，因为菜单载入以后子菜单部分是完全隐藏的，所以将下面的3个子菜单图层均设为隐藏图层,
这时\"下拉\"内容不可见，在例中\"我要起步\"链接上面鼠标双击以选中它，在behavior面板
中点加号选\"Show-Hide Layers\"，在随后的窗口中设定caidan1图层为Show(显示)，同时另外
的两个图层caidan2,caidan3为Hide(隐藏)
这样才能保证只显示对应的子菜单.在behavior列表中点击3个动作事件的箭头按钮将默认
的Onclick改为Onmouseover,
3，同样的方法设定另外两个链接，当然如果制作的是点击式的下拉菜单的话，上面的onlclick事件就
不用更改了.F12查看浏览器中的显示效果.
四、静止浮动图层的效果
这里提到的静止并非图层不移动的意思，而是图层对象相对浏览器窗口的位置保持不变的效
果,
比如永远处在窗口的右上部分，当窗口内容跟随滚动条滑动时，他们会自动的\"飘\"到原来的位置上,
好象浮在了网页上面一样.关于他们相信大家在各大网站上一定经常看到了.
1，在DW中并没有直接提供制作静止浮动层的工具，完成这些是通过相应的插件来实现的, 所以你必须先下载stav插件，推荐地址:www.51step/download/dwplugbe/stav.zip,
解压缩将里面的两个文件(其中包括图片文件Cross Browser Static Division.gif和网页文件Cross Browser Static Division.htm)都拷贝到
DW安装目录Configuration\\Objects\\Common下.
2，重新启动DW，在Object(对象)面板中，你会看到最底部已经多了SI项，选中它在弹出的窗口中设
定
浮动层到上边和左边的距离，然后在图层中插入指定的内容(多为广告或宣传图片)
以替换默认值.这时一个简单的浮动层就完成了.
3，需要调整图层在网页中的位置时，可以先选中它，然后在Properties(属性)板中更改L(左边),T(上边)值.
通过上面几个图层应用的制作分析，希望大家对DW图层的使用有一个更深的了解.
在DW中使层相对于居中的页面定位
实现层相对定位的关键是：
一、先赋予参照物（可以是 table, ）一个 CSS 的属性 position:relative 。
这样浏览器就会以它的左上角为原点，建立新的坐标系。
二、在参照物的下一级加入层，并赋予层绝对定位的 CSS 属性 position:absolute 。
注意：这时绝对定位的 top 和 left 的值都是先对于参照物的。
这样不管你的参照物位置怎样移动，层也就跟着移动了。这对使用层做显现式菜单，
而页面实用居中对齐的网页来说很重要，不然用800x600做的网页，在1024x768下就会按键和菜单分离。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。