电子商务网页制作-项目9_第1页
电子商务网页制作-项目9_第2页
电子商务网页制作-项目9_第3页
电子商务网页制作-项目9_第4页
电子商务网页制作-项目9_第5页
已阅读5页，还剩21页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

DW工程九电子商务网页制作网页特效的使用 学习为网页元素添加行为 学习在网页中插入网页特效工程目标试一试——有趣的网页特效第一步：翻开IE浏览器，在地址栏中输入，将翻开北京银行官方网站首页。试一试——有趣的网页特效第一步：翻开IE浏览器，在地址栏中输入，将翻开北京银行官方网站首页。试一试——有趣的网页特效第二步：观察北京银行网站首页具有的特效。顶部显示了当前的日期；“京行公告〞栏采用了滚动文字效果；网页两侧使用了层广告效果。第三步：在IE浏览器地址栏中输入，将翻开华夏银行官方网站首页，在翻开首页的同时，会自动弹出以下图所示的广告窗口，这也是网页特效的一种。试一试——有趣的网页特效很多网站都会参加假设干网页特效以增强网站的动态效果，此外还可以制作网页广告，提高网页的宣传效果。网页特效的种类很多，可根据需要选用，但是网页特效的使用不宜过杂，要有针对性，不能引起浏览者的反感。活动小结行为概述行为是在某一对象上因为某一事件而触发某一动作的综合描述，它是被用来动态响应用户操作、改变当前页面的效果或是执行特定任务的一种方法。行为是由事件、对象和动作构成的。使用行为，我们可以完成翻开新浏览器窗口、改变对象属性、制作文字滚动等效果。行为是由事件和触发该事件的动作组合而成的。在“行为〞面板中，通过指定一个动作然后指定触发该动作的事件，可将行为添加到网页中。行为概述事件：事件是浏览器生成的消息，指示网页的访问者执行了某种操作。比方，当访问者将鼠标指针移动到某个链接上时，浏览器为该链接生成一个onMouseOver事件；然后浏览器查看是否存在当为该链接生成该事件时浏览器应该调用的JavaScript代码。动作：动作是由预先编写的JavaScript代码组成的，这些代码可以执行特定的任务，比方翻开浏览器窗口、显示或隐藏层、播放声音或停止Shockwave影片。单个事件可以触发多个不同的动作，可以指定这些动作发生的顺序。行为的触发事件行为的产生要通过事件来触发，常见的事件如鼠标单击、页面加载、鼠标移入、按键等等。翻开“窗口〞菜单，选择“行为〞命令，将在面板组中翻开“行为〞面板：onBlur：当指定元素失去焦点时产生的事件。onClick：当用户单击指定元素时产生的事件。onDbClick：当用户单双指定元素时产生的事件。onError：当页面或图像载入，发生错误时产生的事件。onFocus：当指定元素获得焦点时产生的事件。onKeyDown：当用户按下任意键时产生的事件。行为的触发事件onKeyPress：当用户按下任意键并释放该键时产生的事件。onKeyUp：当用户释放按下的任意键时产生的事件。onLoad：当图像或网页载入完毕时产生的事件。onMouseDown：当用户在网页的某元素上按下鼠标时产生的事件。onMouseMove：当鼠标移动时产生的事件。onMouseOut：当鼠标离开某元素范围时产生的事件。onMouseOver：当鼠标移动到某元素范围内时产生的事件onMouseUp：当按下的鼠标被松开时产生的事件。onUnLoad：当页面卸载时产生的事件。可添加行为的常见网页元素选取网页元素可通过单击该元素或通过相应标签进行选取。这些不同的网页元素可以产生不同的事件。可附加行为的常见对象包括：1．<A>：超链接可以产生的事件有：onClick、onDbClick、onKeyDown、onKeyPress、onKeyUp、onMouseDown、onMouseOut、onMouseOver、onMouseUp。2．<AREA>：图像的热点区域可以产生的事件有：onClick、onDbClick、onMouseOut、onMouseOver。3．<BODY>：HTML文件的正文局部可以产生的事件有：onBlur、onError、onFocus、onLoad、onUnLoad。4．<FORM>：表单对象可以产生的事件有：onSubmit、onReset。5．<FRAMESET>：框架集可以产生的事件有：onBlur、onFocus、onLoad、onUnLoad。可添加行为的常见网页元素6．<IMG>：图像可以产生的事件有：onError、onLoad。7．<INPUT>：按钮、复选框、文件域、密码域、单项选择按钮、提交按钮或重置按钮等可以产生的事件有：onBlur、onClick、onFocus、onMouseDown、onMouseUp8．<SELECT>：下拉菜单可以产生的事件有：onBlur、onFocus。9．<TEXTAREA>：文本区域可以产生的事件有：onBlur、onFocus、onKeyDown、onKeyPress、onKeyUp。在实际应用时，可根据需要选择元素的事件来触发行为。DreamweaverCS5的行为应用1．翻转图像翻转图像可以增添美观而专业的装饰效果，是网页设计的常用手法，通过使用“交换图像〞和“交换图像恢复〞行为，很容易实现翻转图像的效果。〔1〕选中一个图像，翻开“行为〞面板，单击面板中的“+〞按钮，翻开下拉菜单，选择其中的“交换图像〞命令，将翻开“交换图像〞对话框：DreamweaverCS5的行为应用〔2〕在“设定原始档为〞文本框中输入要交换的图像的地址，或者单击“浏览〞按钮查找并选择图像文件。〔3〕选中“预先载入图像〞复选框。〔4〕如果选中“鼠标滑开时恢复图像〞复选框，那么鼠标移到图片上时，图片翻转；鼠标移走后，图片复原。〔5〕单击“确定〞按钮完成此行为的设置。这时可以看见，插入的动作已经出现在“行为〞面板中：DreamweaverCS5的行为应用2．弹出信息“弹出信息〞动作可以设置弹出消息框显示指定的消息。可以给某个按钮或链接设置单击事件弹出信息，也可以设置网页加载时弹出信息。〔1〕选择某个按钮或链接，在行为面板下拉菜单中选择“弹出信息〞，将翻开“弹出信息〞对话框：〔2〕在“消息〞文本框中输入信息内容，单击“确定〞完成弹出信息行为的设置。DreamweaverCS5的行为应用3．翻开浏览器窗口翻开浏览器窗口是网上广告投放的一种常见形式。使用行为可以轻松实现这个动作。〔1〕在行为面板下拉菜单中选择“翻开浏览器窗口〞，将翻开“翻开浏览器窗口〞对话框：〔2〕在“要显示的URL〞文本框中输入要翻开的文件的地址，或单击“浏览〞按钮查找并选择该文件。在“窗口宽度〞和“窗口高度〞中设定窗口的尺寸。在属性一栏中，选择相应的选项，以控制翻开的新窗口的外观。〔3〕单击“确定〞完成此行为的设置。〔4〕如需要更改触发动作的事件可参考前面的说明。DreamweaverCS5的行为应用4．改变属性可以设置某种鼠标事件来改变对象的属性。比方鼠标移过时改变对象的颜色，或者改变对象的大小等等。〔1〕选择要改变属性的对象，如一个链接或是一个图像，在属性面板中为其设置一个ID名。〔2〕在行为面板下拉菜单中选择“改变属性〞，将翻开“改变属性〞对话框〔3〕选择“元素类型〞和“元素ID〞，在“属性〞中选择要改变的属性类型，在“新的值〞文本框中输入改变后的属性值。〔4〕单击“确定〞完成此行为的设置。〔5〕如需要更改触发动作的事件可参考前面的说明。DreamweaverCS5的行为应用5．显示/隐藏元素显示和隐藏元素可以实现网页对象的出现的隐藏，可以用于制作网页小广告，点击关闭将小广告隐藏，也可以用于制作层提示效果等。如果要制作一个隐藏对象的效果，点击一个按钮将一幅广告图片隐藏，可按如下操作进行：〔1〕选择要隐藏的图片，在属性面板中为其设置一个ID名。〔2〕选择触发隐藏动作的按钮，在行为面板下拉菜单中选择“显示/隐藏元素〞，将翻开“显示/隐藏元素〞对话框〔3〕选择图片的ID名，点击“隐藏〞按钮后单击“确定〞。〔4〕如需要更改触发动作的事件可参考前面的说明。网页特效概述1.什么是网页特效网页特效就是网页的特殊效果，是一段编写好的脚本程序，应用它可以让网页变得形式多样，更加吸引人，比方弹出窗口、漂浮广告等。2.网页特效的分类常用的网页特效有很多，根据其作用的对象可分为以下几类：文本特效类、图形图像类、鼠标事件类、网页特效类、背景特效类、时间日期类、按钮特效类、状态栏特效类、代码生成类、等等。网页特效概述3.网页特效代码的应用网页特效代码的应用十分简单，只要根据特效说明，把这些代码复制、粘贴到网页源代码的相应位置中，保存文件，再在浏览器中翻开，就能够看到效果了。在网页源代码中插入特效代码有两种方式：〔1〕在Dreamweaver中应用特效代码。用Dreamweaver翻开要应用特效的网页，切换到代码视图，将特效代码插入到指定位置，然后做相应的调试即可。〔2〕直接使用文本编辑器。直接用文本编辑器〔如记事本〕翻开网页文件，将特效代码插入到指定位置，然后做相应的调试即可。网页特效实例1．图片逐渐显现脚本说明：第一步：把如下代码参加<body>区域中：<SCRIPTFOR=windowEVENT=onLoadLANGUAGE=vbscript> image1.filters.item(0).apply() image1.filters.item(0).transition=12 image1.Style.visibility="" image1.filters(0).play(2.0)</SCRIPT>第二步：把如下代码参加<body>区域中：<imgsrc="图片的URL"id="image1"style="visibility:hidden;FILTER:revealTrans(Duration=4.0,Transition=23);">网页特效实例2．显示日期和时钟脚本说明：第一步：把如下代码参加<body>区域中<divid="shijian"></div>第二步：把如下代码参加<body>区域中：<scripttype="text/javascript">functionshowtime(){

vartoday=newDate();varnian=today.getFullYear();varyue=today.getMonth()+1;varri=today.getDate();varday=today.getDay;varshi=today.getHours();varfen=today.getMinutes();varmiao=today.getSeconds();if(today.getDay()==0)day="星期日";if(today.getDay()==1)day="星期一";if(today.getDay()==2)day="星期二";if(today.getDay()==3)day="星期三";if(today.getDay()==4)day="星期四";

if(today.getDay()==5)day="星期五";if(today.getDay()==6)day="星期六";if(shi<10)shi="0"+shi;if(fen<10)fen="0"+fen;if(miao<10)miao="0"+miao;document.getElementById("shijian").innerHTML="<h2>今天是："+nian+"年"+yue+"月"+ri+"日"+day+"<br>"+"现在时刻："+shi+":"+fen+":"+miao+"</h2>";setTimeout(showtime,1000);}</script>网页特效实例第三步：在<body>标签内参加代码onload="showtime()"：<bodyonl

人人文库> 全部分类> 行业资料 > 管理策划

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论