Dreamweaver轻松制作网页滚动布告栏

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

  滚动报告栏通常是通过利用 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 所示的操作,即可解决这个问题。


  ( 6 )执行完如图 56-6 所示的操作后,在图 56-5 中所示的第 3 步再分别选择【# divDownControl 】、【# divContainer 】和【# divContent 】选项,然后再分别执行如图 56-6 所示的操作。给 4 种样式分别加上【像素】单位后测试网页,就可以看到如图 56-7 所示的滚动公告栏了。

  ( 7 )将鼠标光标分别移动到【 Scroll up 】和【 Scroll down 】上面,就可以看到中间的文字上下滚动了。

  Dreamweaver 的插件种类繁多,功能强大。善于发现和使用插件,可以制作出一些 Dreamweaver 本身望尘莫及的效果。

 

时间: 2024-08-13 02:53:05

Dreamweaver轻松制作网页滚动布告栏的相关文章

dreamweaver怎么制作网页滚动字幕

滚动字幕在FrontPage的组件里有,但是FrontPage这个软件只能支持单行文字,一出现多行文字它就无能为力了,而且它只能支持一行滚动!(如果出现只能滚动一行的情况,解决办法是把这段代码嵌入到JavaScript的document.write里面,请看下面例的详细说明)Dreamweaver也只能用编写HTML代码的方法.所以强烈建议用记事本打开网页源代码来编辑. 1.建立第一个滚动字幕.代码: 以下是引用片段: <marquee scrollAmount=2 width=300>滚动字

入门:Dreamweaver轻松制作网页页内连接

dreamweaver|网页 在网页制作中我们经常会遇到有时需要制作页内连接的情况,比如首先列出一个目录,然后后面内容是按目录列出的,我们需要实现的是当点击目录中的一项时,直接转到内容页面. 首先把光标定位到要连接的内容页面的位置的左侧,然后插入命名锚记. 给锚记命名一个名称. 然后再选择目录,设置超级连接. 保存后,按F12浏览.

Dreamweaver轻松制作网页转场特效

网页中经常会有一些像动画那样的刷新效果,如卷动.百页窗等.这样的网页看起来会更有动感,不过也要注意适可而止,否则太花哨的变化也容易引起浏览者的反感. 效果说明 建立两个页面,并在两个页面之间建立超链接,当单击超链接时,即可以动画的形式进入到另一个页面,如图 40-1 所示.实际效果请欣赏随书光盘中< Dreamweaver MX 2004 100 例>目录下的<实例 40 -网页过渡特效>文件. 创作思想 打开 Dreamweaver MX 2004 软件,新建两个页面,然后分别为

Dreamweaver轻松制作网页反馈表单

本文介绍制作客户反馈表单的过程.主要内容是使用表格设计表单结构和设置form参数. 1.将插入点放在希望表单出现的位置.选择"插入">"表单",或选择"插入"栏上的"表单"类别,然后单击"表单"图标. 2.将插入点放在红色的表单中,单击"插入"栏"常用"类别中的"表格"按钮. 3.在"插入表格对话框中,设置行数11,列数2. 4.在

Dreamweaver批量制作网页

dreamweaver|网页    做网站,麻烦在于更新,特别是大规模更新,工作量非常大.真不知那些创意不断而又勤奋的"站长"隔三岔五就将网站来个"大换血"是怎么忙过来的?告诉你吧,他们大多都是在"批发"网页,并且你的机器中也有这样的"批发站"呢!别吃惊,这个好东东就是--模板.常见的网页制作工具:FrontPage.Dreamweaver中都有这项功能.比如用Dreamweaver制作网页时,使用模板就能减少大量的重复劳动.

Dreamweaver轻松制作Flash

漂亮的Flash动画人人喜欢,不过制作起来的确有一些技术难度.你知道吗,Dreamweaver作为一个网页制作工具,还可以创建好玩的Flash相册.今天我们就来利用它来制作一个简单.漂亮的Flash相册,最终效果如图1. 图1 插入Flash元素 运行Dreamweaver,点击菜单"插入"→"媒体"→"图像查看器",系统会自动弹出"保存Flash元素"对话框,键入保存的文件名,例如:"Photo.swf"

折叠菜单用dreamweaver轻松制作

用dreamweaver来制作折叠菜单其实很方便,不管你懂不懂js.css都可以快速方便的点几下就可以制作出漂亮的折叠菜单效果,下面我们来看看教程吧. 新建一个文件,在菜单工具栏选择,插入记录-布局对象-Spry折叠菜单如下图: 运行一下看看吧,一个超漂亮的效果哦.

Dreamweaver插件轻松制作网页漂浮广告

用以下这个插件就可以做到~~ 「flevPersistentDivs.mxp」 http://www.webjx.com/files/soft/1_100228045043.rar 滑动图层,当网页卷轴拉动时,图层会跟着上来滑动,大部份网站拿来做滑动广告,也可以拿来做滑动选单,是网路上很常用到的效果.... 作法: 先在 Dreamweaver 插入一个图层 然后将广告图片放在图层里面 最后,在<body>标签上使用这个插件即可 真是好用的外挂 安装后会放在行为→新增行为→RibbersZee

dreamweaver怎么制作网页

  一.定义站点 1. 在任意一个根目录下创建好一个文件夹(我们这里假设为E盘),如取名为MyWeb. ***备注:网站中所用的文件都要用英文名. 2.打开Dreamweaver,选择"站点-新建站点",打开对话框.在站点名称中输入网站的名称(可用中文),在本地根文件夹中选择刚才创建的文件夹(E:web).然后确定即可. ***备注:再次打开Dreamweaver,会自动找到刚才设立的站点.如果有多个站点,可以在菜单"站点-打开站点"中去选择. 二.创建页面 1.在