第十三节 创建导航条

在很多时候，一个网站的不同页面都使用了同一导航条。导航条一般由几个图像构成，点击不同的图像，将链接到网站不同的页面。通过统一导航条的方法，我们可以实现网站风格的统一，同时也方便了访问者在不同页面间的跳转。
用Dreamweaver可做出比较复杂的导航条。导航条由一个或几个部位组成，每个部位均由图像构成，链接到不同的网页页面。每部分，最多可设四个状态下的图像，开始是一个初始图像，当鼠标移动到这个部位上时显示另一个图像，还可设置当鼠标点击后的初始图像，以及鼠标点击后当鼠标再次移动到这个部位上的图像。虽然可做的相当复杂，但建议一般情况下每部位只设一到两种状态的图像。图像太多，会影响网页页面的访问速度。
要设置导航条，首先要准备各部位、各状态的图像，然后移动光标到需要导航条的地方。这时可直接点击Objects面板上的图标，或点击菜单栏的Insert/Navigation Bar，会弹出一个对话框。

（插入导航条对话框）

下面给出详细解释。
先设置第一个部位，在Element Name 后填入你给这个部位的命名。你也可以不填，这时Dreamweaver将自动给它命名。

然后是Up Image，既该部位的初始图像。在其后填入你准备的图像的地址，或点击Browse…按钮选择。每个部位可只设置Up Image，下面的Over Image、Down Image和Over While Down Image三种可以不设置。
下面是Over Image，是鼠标移动到这个部位上时显示的图像。
再下面是Down Image，鼠标点击该部位后显示的初始图像。
还有一个是Over While Down Image，是鼠标点击后当鼠标再次移动到这个部位上时显示的图像。
图像设置完成后，可给该部位设置超级链接。在When Clicked Go To URL后填入链接到的文件的地址，或点击Browse…按钮选择。紧跟其后的有一个下拉选框，这是设置超级链接的Target。
接着下面是Options，有Preload Images和Show “Down Image” Initially两项。
若选中Preload Images前的选框，则访问者浏览这个页面时，所有图像将在页面下载的同时全部下载，虽然整个页面打开的速度会慢些，但图像间转换会没有延迟。若去掉对Preload Images前选框的选择，页面下载的同时只下载初始图像，其它图像在轮到显示时才开始下载，这样整个页面打开的速度较快，但图像间转换会有延迟。
若选中Show “Down Image” Initially前的选框，则将Down Image设为初始图像。相应Over While Down Image改为鼠标移动到这个部位上时显示的图像，Up Image改为鼠标点击该部位后显示的初始图像，Over image 改为鼠标点击后当鼠标再次移动到这个部位上时显示的图像。
接下来，Insert后选框有Horizontally和Vertically两个选项。选中Horizontally是导航条水平展开，选中Vertically 是导航条垂直展开。
最后有Use Table 一项，选中后，即表示Dreamweaver自动生成html代码将导航条各部位用表格隔开。
一个部位设置完成，要添加部位，可点击对话框上方的“+”按钮，接下来可按前面的步骤对新增的部位进行设置。要减去某一个部位，在Nav Bar Elements的选框中选中它，再点击对话框上方的“-”按钮。
导航条各部位间，按其在Nav Bar Elements的选框中由上到下的顺序，在页面中按从左到右或从上到下的顺序排列。要改变其在页面中的排列顺序，应先改变其在Nav Bar Elements的选框中的上下排列顺序。在Nav Bar Elements的选框中选中你想改变排列顺序的部位，点击对话框上方向上的箭头，即把此部位向上移动，点击向下的箭头是向下移动。

 如果您对本文有任何疑问或者建议，请到讨论区发表您的意见: >> 论坛入口 <<

上一篇：第十四节 设置   下一篇：第十五节 导入表格数据

【文章评论】 【收藏本文】 【推荐好友】 【打印本文】 【我要投稿】 【论坛讨论】