分享
 
 
 

用Dreamweaver做动态文本

王朝html/css/js·作者佚名  2008-05-19
窄屏简体版  字體: |||超大  

很多人认为在网页文本上应用特殊效果是作不出太多文章的,故很少涉足,但是如果你仔细研究一下Dreamweaver MX的Behaviors功能,就会发现用Dreamweaver MX其实也可以制作出不少很好的动态文本特效,比如:文字大小变换、动态文本按钮等等。下面我们就结合一个例子谈谈网页中的文本特效。

这个实例效果是:当鼠标移动到网页中按钮上时,实现按钮导航文本变大,同时按钮颜色进行变换,而移开时恢复初始状态。

Step1:执行菜单“Insert/Table”命令,在编辑区中插入一个一行一列的表格。

Step2:选中该表格,使用快捷键Ctrl+F3打开其属性控制面板,设置表格背景色彩“Bg Color”参数值为#0099FF,表格边线色彩“BrDr Color”参数值为#000000(图1)。

图1 设置表格的颜色

Step3:选中单元格,设置单元格属性面板中背景色彩“Bg”参数值为#006699,单元格边线色彩“BrDr”参数值为#FFFFFF。通过以上设置,使表格更具有立体感。

Step4:单击工具栏“Show Design View”按钮,显示代码窗口,在表格开始和结束段加代码“〈div id="bottun"〉... 〈/div〉”使表格产生一个Div标记名称(图2)。

Step5:在单元格中输入按钮导航文本,并设置文本属性,这里可以把导航文

本做成超级链接,并设置其字体、字号和居中效果。

图2 为表格加入代码

Step6:同样道理在导航文本开始和结束段加上这样的代码“〈span id="text" 〉...〈 /span 〉”,使该文本产生一个Span标记名称。

Step7:按快捷键Shift+F3打开Behaviors行为面板,点击面板上“+”按钮,在弹出行为列表中选择“Change Property”动作,这里我们设置几个当鼠标移动和离开按钮文本上时,文本和背景颜色发生变化的动作。选择“Change Property”动作对话框中的“Div”动作类型(Type of Object),在类型名称(Named Object)下拉列表中会列出我们标记的“bottun”标记,选择它并设置Property下拉列表中的“style-backgroundcolor”的New Value值为#6699CC,确认返回Behaviors面板,最后更改动作触发事件类型为Onmouseover。同样方法再设置当鼠标离开时,将背景颜色改为初始颜色,即##006699。

同理,我们也是应用这个动作,只要设置了文本“Change Property”的动作(这个动作类型“Span”),控制鼠标移动和离开时的文字大小变换就可以了。

这样动态文本按钮就制作成功了,当然这个效果还可以再加工,如果你点击选取了该按钮,再进行一次按钮色彩的变换表示已经选中,那么这个动态按钮的效果就更完美了

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有