DW网页设计100例56：制作滚动布告栏

日期：2007年6月5日作者：查看:[大字体中字体小字体]

本文选自4u2v工作室编写的《Dreamweaver网页设计与制作100例》（人民邮电出版社出版，ISBN： 7115142394）。未经著作权所有者书面授权许可，禁止转载本文。

购买地址：点击访问

如果想要在网页里显示最新信息、新闻、通知、布告等较长的文字信息，而又不想占用太多的网页空间，可以使用滚动报告栏。

滚动报告栏通常是通过利用 javascript 技术控制网页中的层的滚动来实现的，然而手工编写 Javascript 代码进行制作肯定是比较复杂、困难的事情。使用 Dreamweaver 为用户提供的【 ScrollableArea 】插件可以快速便捷地制作出滚动报告栏。

效果说明用户可以通过滚动栏上的【向上滚】和【向下滚】两个按钮控制报告栏文字的滚动速度和方向。实际效果请浏览随书光盘中【源文件】下的对应文件。

创作思想在随书光盘中找到“ ScrollableArea ”插件，然后运行 Macromedia 的插件管理器安装插件。接着打开 Dreamweaver MX 2004, 在【命令】菜单中单击【 dHTML AP Scrollable Area 】选项，就可以开始设计滚动布告栏了。

操作步骤

（ 1 ）安装插件。首先在随书光盘中的【源文件】 / 【实例 56 】目录里面找到 Dreamweaver 的“ ScrollableArea.mXP ”插件，接着运行 Macromedia 的插件管理器“ Extension Manager.exe ”， Macromedia 的插件管理器是随 Dreamweaver 自动安装的，通常和 Dreamweaver 安装在同一目录下面的“ Extension Manager ”文件夹里面。

（ 2 ）选择插件管理器菜单栏上的【文件】菜单进行操作，如图 56-1 所示。

提示：如果插件文件已经和 Macromedia 的插件管理器建立了文件关连，那么直接双击插件文件就可以自动打开 Macromedia 的插件管理器安装插件了。

（ 3 ）单击【安装】按钮后会弹出一个安装协议窗口。单击安装协议窗口上面的【接受】按钮完成安装。

（ 4 ）设置滚动布告栏。安装完插件后运行 Dreamweaver MX 2004 ，打开或者新建一个 web 文档，进行如图 56-2 、图 56-3 和图 56-4 所示的操作。

5 ）经过上面的操作，基本完成了滚动布告栏的制作。在 Dreamweaver 中执行【文件】 / 【在浏览器中预览】 / 【 IE 浏览器】命令或者单击键盘上的 F12 键预览网页时，可能会出现不正常显示的情况，这是由于 ScrollableArea 产生的代码中没有设置图层位置的单位。执行如图 56-5 和图 56-6 所示的操作，即可解决这个问题。

点击查看大图
[1] [2] 下一页
DW网页设计100例56：制作滚动布告栏相关文章：
·DW网页设计100例56：制作滚动布告栏
DW网页设计100例56：制作滚动布告栏相关软件

上一篇:DW网页设计100例57：滚动链接层

下一篇:DW MX实例：给产品下订单

特别声明：本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作
者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转
载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源：http://www.hackhome.com

DW网页设计100例56：制作滚动布告栏

精品推荐

热点TOP10

特别推荐