dreamweaver特效
- 格式:doc
- 大小:45.50 KB
- 文档页数:5
收稿日期:2008-12-18*张影鹤岗师范高等专科学校计算机系助理讲师(黑龙江,鹤岗154107)。
Dreamweaver 是美国Macromedia 公司开发的集网页制作和网站管理于一身的所见即所得的网页编辑器。
具有强大的编辑功能,能够方便地实现对网页创作的灵感,使设计者不必编写HTML 代码就能够实现用JavaScript 和DHTML 才能实现的特效。
1让网页紧贴浏览器窗口的顶部和左边当在页面中插入了对象(如文字、表格、图片等等),即使设置了左对齐或顶端对齐,在浏览时还是和页面左边或顶端有一定的距离。
要让网页紧贴浏览器窗口的边缘。
需在<body>标签中加参数“margin ”。
如:<body bgcolor=″#0066CC″text=″#000000″leftMargin=0topMargin=0>其中leftMargin 和topMarg 分别指左边界和顶部边界。
或在页面属性对话框中,设置“Left (左边界)”和“Top (顶部边界)”均为“0”。
2硬回车与不产生段落换行(1)硬回车:不仅换行还产生一个段落(即<p>和</p>标记)。
(2)只产生换行的效果,不产生段落,可以任选下列一种操作:①Shift+Enter 键;②选择菜单命令“In Bert /Special Characters /Line Break ”;③在代码视图HTML 文档中相应位置添加<br>标记。
3将内层表格壁紧贴外层表格壁首先将外层表格的“Ce11Pad (单元格边距)”设置为“0”,其次将内层表格“Width ”和“Height ”分别设为“100%”,最后再拖动边框使内层表格完全贴着外层表格。
4添加透明flash用Dreamweaver 打开网页,找到要设置透明的FLASH,添加代码:<param name=″Wmode″value=″transparent″>5导入数据Dreamweave 提供了导入功能,可以将文字资料或表格2009年4月第2期电脑学习摘要:结合在日常教学中所总结的经验,介绍一些Dreamweaver 的使用技巧。
Dreamweaver这个名字相信大家都不会陌生了。
自打上市以来以其鲜明的特性和完善的功能赢得了众多网友的青睐。
Dreamweaver能够在众多的同类软件中赢得一席之地,主要归功于它完全开放的插件环境以及它所能创造出的那些另人耳目一新的网页特效。
我即将要向大家介绍的就是通过Dreamweaver的行为事件所制作出的一些网页特效。
这其中有一些是通过Dreamweaver的插件来实现的。
希望大家可以通过这些特效使自己的网页更加的绚丽多彩。
一.通过链接实现对Flash的控制为了使网页本身活动起来,我们在制作网页时往往会插入一些诸如FLASH的动画,那么有没有什么方法使浏览者在浏览时可以控制这些动画的运程呢?答案是有的!首先我们选中将要附加行为的对象,例如一段加有链接的文字。
随后按下快捷键F8,单击行为面板上的"+"按钮,打开动作菜单,选择"control shckwave or flash"此时会弹出如图1的对话框。
(当然在此之前你的网页中一定要已经插入了FLASH的动画,并对其命名)。
从"movie"(动画)下拉菜单中选择将要控制的对象名称以及嵌入对象所使用的标记。
再在"Action"(动作)区域选择所要实现的效果。
〃PLAY(播放)选择该项是当鼠标移动到链接上时播放动画。
〃STOP(停止)选择该项是当鼠标移动到链接上时停止动画的播放。
〃REWIND(返回)选择该项是当鼠标移动到链接上时动画返回到最前端。
〃GO TO FRAME(跳转) 选择该项是当鼠标移动到链接上时动画跳转到所指定位臵。
并停留在该位臵上。
设臵完后按快捷键F12,在浏览器中预览。
怎么样这回FLASH听话了吧!二.可拖动的层这个网页特效可以使浏览者通过鼠标的拖动来移动一个层,这样不但给了浏览者一定的自主空间,同时在无形之中也给你的网页加入了一条亮丽的风景线。
Dreamweaver使用技巧集锦11、在Dreamweaver 3中输入空格1)可以用中文的全角状态下按空格键,强烈推荐2)插入一个透明的图3)用pre标签里写你的内容4)object 里的invisiables 里的none-breaking space 点一下5)instert 菜单下的none-breaking space6)CTRL+SHIFT+空格键加入7)CTRL+T 去掉尖括号,键入 ;(注后面四个是的实质都是一样的)2、实现浏览器状态栏中的滚动字幕按下F8键,在Behaviors窗口中选取Behaviors,单击“+”号,再选取“Set Text→Set Text of Status Bar”,最后在弹出的对话框中写上你想在状态栏出现的文字就可以了。
3、制作鼠标移动上去会有变化的动态链接图像首先准备两幅图,第一幅是原始图像,另一幅是鼠标移动上去后的图像。
用鼠标单击第一幅图,在属性面板中的链接栏中填上要链接的文件,然后按F8,在Behaviors窗口中点击“+”号,选择“Swap Image”,在出现的窗口中选择第二幅图,点击确定,就成功了。
4、将 Dreamweaver 集成到 IE 浏览器Dreamweaver 安装程序会在上下文选单增加一个“Edit with Dreamweaver”命令。
还可以修改 Windows 的注册表,就象 MS Word 、Frontpage 和 Notepad 一样,通过 IE 工具栏的编辑按钮来调用 Dreamweaver 打开当前网页。
将下面文本的最后一行要改为你自己的 Dreamweaver 安装路径,把它们保存为一个*.reg 文件,双击它将信息添加到注册表即可。
REGEDIT4[HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver][HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver\shell][HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver\shell\edit][HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver\shell\edit\command]@="\"D:\\Macromedia\\Dreamweaver 3\\dreamweaver.exe\" \"%1\""如果要设置为 IE 缺省的编辑器,打开 IE 的“Internet 选项”,在程序标签指定。
Dreamweaver这个名字相信大家都不会陌生了。
自打上市以来以其鲜明的特性和完善的功能赢得了众多网友的青睐。
Dreamweaver能够在众多的同类软件中赢得一席之地,主要归功于它完全开放的插件环境以及它所能创造出的那些另人耳目一新的网页特效。
我即将要向大家介绍的就是通过Dreamweaver的行为事件所制作出的一些网页特效。
这其中有一些是通过Dreamweaver的插件来实现的。
希望大家可以通过这些特效使自己的网页更加的绚丽多彩。
一.通过链接实现对Flash的控制为了使网页本身活动起来,我们在制作网页时往往会插入一些诸如FLASH的动画,那么有没有什么方法使浏览者在浏览时可以控制这些动画的运程呢?答案是有的!首先我们选中将要附加行为的对象,例如一段加有链接的文字。
随后按下快捷键F8,单击行为面板上的"+"按钮,打开动作菜单,选择"control shckwave or flash"此时会弹出如图1的对话框。
(当然在此之前你的网页中一定要已经插入了FLASH的动画,并对其命名)。
从"movie"(动画)下拉菜单中选择将要控制的对象名称以及嵌入对象所使用的标记。
再在"Action"(动作)区域选择所要实现的效果。
·PLAY(播放)选择该项是当鼠标移动到链接上时播放动画。
·STOP(停止)选择该项是当鼠标移动到链接上时停止动画的播放。
·REWIND(返回)选择该项是当鼠标移动到链接上时动画返回到最前端。
·GO TO FRAME(跳转) 选择该项是当鼠标移动到链接上时动画跳转到所指定位置。
并停留在该位置上。
设置完后按快捷键F12,在浏览器中预览。
怎么样这回FLASH听话了吧!二.可拖动的层这个网页特效可以使浏览者通过鼠标的拖动来移动一个层,这样不但给了浏览者一定的自主空间,同时在无形之中也给你的网页加入了一条亮丽的风景线。
学会使用AdobeDreamweaver进行网页动画制作第一章:Adobe Dreamweaver简介Adobe Dreamweaver是一款功能强大的网页设计和开发工具,由Adobe公司开发。
它集成了网页制作所需的各种工具和功能,能够帮助用户创建出精美、功能丰富的网页。
Dreamweaver具有直观的界面和强大的编辑器,使得用户可以轻松地编辑和调整页面布局、添加多媒体元素等。
同时,它还支持网页动画制作,提供了丰富的动画特效和工具,方便用户创建出生动有趣的网页。
第二章:了解网页动画网页动画是指在网页中使用图像、文字或其他元素进行动态效果展示的技术。
通过使用网页动画,可以使网页更加吸引人,增强用户的视觉体验,提高网页的互动性和吸引力。
常见的网页动画效果包括渐变、旋转、缩放、动态图像切换等。
在使用Dreamweaver制作网页动画之前,我们需要了解不同的网页动画效果以及如何选择合适的效果来展示我们的内容。
第三章:使用Dreamweaver制作基础网页动画在Dreamweaver中制作网页动画非常简单。
首先,我们可以使用内置的动画特效库来选择我们所需的动画效果,如文本闪烁、图像飞入等。
只需要简单的拖拽和设置一些参数,就能够在网页中实现这些动画效果。
另外,Dreamweaver还提供了可视化的时间轴编辑器,方便用户调整动画的持续时间、延迟时间和循环次数等。
第四章:自定义网页动画效果除了使用Dreamweaver内置的动画特效库,我们还可以通过自定义代码来创造独特的网页动画效果。
Dreamweaver支持HTML、CSS和JavaScript的编辑和预览,我们可以使用这些语言来编写我们所需的动画效果代码。
通过控制元素的位置、大小、颜色和透明度等属性,以及使用CSS3的过渡和动画效果,我们可以实现更加丰富多样的网页动画效果。
此外,还可以结合JavaScript的能力,实现更高级的动画效果,如拖拽、碰撞效果等。
用DW制作花朵的代码
用Dreamweaver制作花朵
Dreamweaver是一款很强大的网页开发工具,它可以帮助我们很容易地把灵感变成现实,甚至可以用来制作出精致的花朵。
本文将介绍用Dreamweaver制作花朵的步骤。
第一步,打开Dreamweaver并进入新网页的编辑界面,在此,我们需要选择“绘图”工具,用它来帮助我们开始制作花朵。
花朵的轮廓需要我们一步一步地定义,可以用矩形、椭圆、多边形或者自由画线,来描绘出它的轮廓。
第二步,用“填充”工具来填满轮廓,可以通过调整滑块来选择想要的颜色。
如果想要让花
朵更美观,可以添加花瓣或者花蕊,甚至可以把花朵涂上渐变色。
第三步,使用“文本”工具,可以把花朵边缘的文字或者花枝上的语言文字加上,还可以把
花的名字写上,诸如此类的相关文字。
第四步,使用“特效”工具,可以对花朵进行修饰,诸如背景灯光、颜料渲染、模糊化等,
这样既可以使花朵更好看,也可以突出它的独特风格。
第五步,最后,使用“保存”工具,把完成的花朵图片保存下来。
用Dreamweaver制作花朵的步骤描述完毕,它的简单便捷使用起来,可以帮助我们很容
易地实现自己的想法,携手Dreamweaver,为大家打造出视觉精美的花朵图案吧!。
Dreamweaver8教程1、Flash透明化:插入Flash动画后,点击Flash图画,在属性中选择“参数”,在参数对话框左侧参数处填“wmode”,在右侧值的对应处填“transparent”,再点击“确定”即可。
2、设置滚动字幕:把光标插入点放在需要插入滚动字幕的地方,点击插入面板的“标签选择器”图标,选择“HTML标签”下的“页标签”中的“marquee”。
再转到代码视图,选择“窗口”——>“标签检查器”,在属性中单击未分类前面的“+”,可以在“标签检查器”中设置标签的各种用法。
点击“behavior”设置项右边的下拉箭头,选择滚动字幕内容的运动方式(“alternate”指内容在相反两个方向滚动,“scroll”指内容在同一方向滚动,“slide”指内容接触到字幕边框就停止滚动),direction属性设置字幕内容的滚动方向(down 向下滚动,left向左滚动,right向右滚动,up向上滚动),scrollamount属性设置字幕滚动的速度,scrolldelay属性设置字幕内容滚动时停顿的时间(单位毫秒),width属性设置字幕宽度,style属性设置字幕内容的样式,loop属性设置字幕内容滚动次数(默认或-1为无限);在“行为”面板中,onMouseOver事件设置鼠标移动到滚动字幕时的动作(常设置为停止滚动),onMouseOut事件设置鼠标离开滚动字幕时的动作(常设置为开始滚动)。
(例:向上滚动字幕代码<marquee behavior=”scroll”direction=”up”width=”200”height=”150”loop=”-1”scrollamount=”1”scrolldelay=”1”style=”front:12px;”onMouseOver=”this.stop();” onMouseOut=”this.start();”>滚动字幕内容</marquee>3、插入关键字:(关键字用来帮助搜索引擎寻找网页的)选“插入”、“HTML”、“文件头标签”、“关键字”,在空白处输入关键字(多个关键字之间用逗号隔开)。
dw中常用的特效代码参考:/1.让浏览器窗口永远都不出现滚动条。
〈body style="overflow-x:hidden;overflow-y:hidden"〉或〈body style="overflow:hidden"〉或〈body scroll=no〉没有水平滚动条〈body style="overflow-x:hidden"〉没有垂直滚动条〈body style="overflow-y:hidden"〉2,如何给图片抖动怎做的.〈SCRIPT language=javascript1.2〉〈!--var rector=2var stopit=0var a=1var count=0function init(which){stopit=0shake=whichshake.style.left=0shake.style.top=0}function rattleimage(){if ((!document.all&&!document.getElementById)||stopit==1||count==100)returncount++if (a==1){shake.style.top=parseInt(shake.style.top)+rector}else if (a==2){shake.style.left=parseInt(shake.style.left)+rector}else if (a==3){shake.style.top=parseInt(shake.style.top)-rector}else{shake.style.left=parseInt(shake.style.left)-rector}if (a〈4)a++elsea=1setTimeout("rattleimage()",50)}function stoprattle(which){stopit=1count=0which.style.left=0which.style.top=0}//--〉〈/SCRIPT〉〈style〉.shakeimage {POSITION: relative}〈/style〉〈img src="图片的路径" onmouseout=stoprattle(this) onmouseover=init(this);rattleimage()class=shakeimage〉4,在DW如何给水平线加颜色。
⽹页设计dreamwaver期中试题四川省⼴元市职业⾼级中学校2009秋季《⽹页设计与制作》期末考试题(满分 100分,时间90分钟)说明:1、本试卷适⽤班级:08计⼀,08计六2、本试卷属考试科⽬,闭卷考试。
(每个1分,共20分)、翻译:Web page :______________home page :___________________URL:_______________www:_____________Internet:_________________ 、⽹页是由________语⾔编写的⽂本⽂件,所以⽹页⽂件的扩展名⼀般为:_______________。
、在DW8中,使⽤⽹格、______________或跟踪图像等辅助设计⼯具定位⽹页、在DW8中插⼊的⽂本可分为3种类型:普通⽂本、_______________________、⽬前⽹络⽀持的图像格式主要有________________,GIF,PNG三种。
、表格由⾏和列组成,⽽⾏和列的交汇⼜构成了______________________。
、在已有普通表格中添加表格,即创建______________________。
、CSS的样式⼜称:_________________________ 。
、______________________是事件和动作的组合。
、在DW8中,主要通过_________________为对象添加⾏为。
、使⽤_______________⾏为可以在当前窗⼝或指定框架中打开⼀个新的⽹页。
、当对_________________图形进⾏放⼤操作时,不会产⽣失真现象。
13、_________________是构成FLASH动画的基本单位。
14、____________________动画是FLASH中最基本的动画,就像电影的底⽚⼀样,需要⼀帧帧地制作。
15、形状提⽰是由实⼼⼩圆圈加上中间的______________________组成的。
我们在用Dreamweaver 8制作网页的时候,有些代码是要经常用到的,下面我们就来总结一下网页制作中常用的代码,以方便大家更便捷的制作网页。
1.不准粘贴onpaste="return false"2.取消选取、防止复制<body onselectstart="return false">3.防止复制oncopy="return false;" oncut="return false;"4.将彻底屏蔽鼠标右键oncontextmenu="window.event.returnValue=false"<table border oncontextmenu=return(false)><td>no</table> 可用于Table5.可以在收藏夹中显示出你的图标<link rel="Bookmark" href="favicon.ico">6.IE地址栏前换成自己的图标<link rel="Shortcut Icon" href="favicon.ico">7.关闭输入法<input style="ime-mode:disabled">8.防止被人frame<SCRIPT LANGUAGE=JAVASCRIPT><!--if (top.location != self.location)top.location=self.location;// --></SCRIPT>9.永远带着框架<script language="JavaScript"><!--if (window == top)top.location.href = "frames.htm"; //frames.htm为框架网页// --></script>10.网页将不能被另存为<noscript><iframe src=*.html></iframe></noscript>11.删除时确认<a href='javascript:if(confirm("确实要删除吗?"))location="boos.asp?&areyou=删除&page=1"'>删除</a>12.取得控件的绝对位置//Javascript<script language="Javascript">function getIE(e){var t=e.offsetTop;var l=e.offsetLeft;while(e=e.offsetParent){t+=e.offsetTop;l+=e.offsetLeft;}alert("top="+t+"/nleft="+l);}</script>//VBScript<script language="VBScript"><!--function getIE()dim t,l,a,bset a=document.all.img1t=document.all.img1.offsetTopl=document.all.img1.offsetLeftwhile a.tagName<>"BODY"set a = a.offsetParentt=t+a.offsetTopl=l+a.offsetLeftwendmsgbox "top="&t&chr(13)&"left="&l,64,"得到控件的位置"end function--></script>13.光标是停在文本框文字的最后<script language="javascript">function cc(){var e = event.srcElement;var r =e.createTextRange();r.moveStart('character',e.value.length);r.collapse(true);r.select();}</script><input type=text name=text1 value="123" onfocus="cc()">14.判断上一页的来源javascript:document.referrer15.最小化、最大化、关闭窗口<object id=hh1 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11"> <param name="Command" value="Minimize"></object><object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11"><param name="Command" value="Maximize"></object><OBJECT id=hh3 classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11"><PARAM NAME="Command" VALUE="Close"></OBJECT><input type=button value=最小化 onclick=hh1.Click()><input type=button value=最大化 onclick=hh2.Click()><input type=button value=关闭 onclick=hh3.Click()>16.网页不会被缓存<META HTTP-EQUIV="pragma" CONTENT="no-cache"><META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate"><META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">或者<META HTTP-EQUIV="expires" CONTENT="0">17.屏蔽功能键Shift,Alt,Ctrl<script>function look(){if(event.shiftKey)alert("禁止按Shift键!"); //可以换成ALT CTRL}document.onkeydown=look;</script>18.让表单没有凹凸感<input type=text style="border:1 solid #000000">或<input type=text style="border-left:none; border-right:none;border-top:none;很多个人网站的站长都希望为自己的网站建立一个站内搜索引擎,但一不熟悉ASP、PHP、JSP等动态开发技术,另外自己建立站内搜索也需要空间支持相应的动态技术,所以常不得已放弃。
其实,何不借用Google打造站内搜索引擎,来方便网友对自己网站的内容进行查找。
若想在某特定网站内搜索特定的内容(如搜索中包含关键字“网络”的内容),只需要在Google的搜索栏里输入:“网络site:”即可(不含引号)。
如果直接在自己站点的网页上建立一个Google的搜索栏,然后让访问者按Google规定的格式进行查询,那不就能实现Google作为自己站内搜索引擎的功能了吗?但是我们当然不能要求使用者还要特地学习Google对特定网站搜索的格式规范。
于是笔者立刻联想到是否可以使用JavaScript脚本使得Google接收的查询关键字后自动加上类似“site:”的字符串呢?答案当然是肯定的。
在你的网站首页需要放置站内搜索引擎页面的<body>标签的范围内放置如下代码:<script type="text/javascript">var domainroot=""//个人站点域名,替换成你的网站的网址即可function Gsitesearch(curobj){curobj.q.value="site:"+domainroot+" "+curobj.qfront.value}</script><form action="/search" method="get"onSubmit="Gsitesearch(this)"><p>站内搜索:<br/><input name="q" type="hidden" /><input name="qfront" type="text" style="width: 180px" /> <inputtype="submit" value="开始搜索"></p></form>脚本的关键部分在于Gsitesearch函数。