当前位置:文档之家› 老生常谈遮罩层 滚动条的问题

老生常谈遮罩层 滚动条的问题

老生常谈遮罩层 滚动条的问题
老生常谈遮罩层 滚动条的问题

小编遇到的问题是在弹出层后面的遮罩层,因为有滚动条,导致滚动条下面不可视区域没有遮罩层。下面就为大家介绍一下解决方法

今天遇到的问题是,在弹出层后面的遮罩层,因为有滚动条,导致滚动条下面不可视区域没有遮罩层,解决方式是加的css。

js代码

<script type="text/javascript"> 

//显示灰色JS遮罩层 

function showBg(ct,content){

var bH=$(document).height(); 

var bW=$("body").width()+16; 

var objWH=getObjWh(ct); 

$("#fullbg").css({width:bW,height:bH,display:"block"}); 

var tbT=objWH.split("|")[0]+"px"; 

var tbL=objWH.split("|")[1]+"px"; 

$("#dialog").show();

$("#"+ct).css({top:tbT,left:tbL,display:"block"}); 

$(window).scroll(function(){resetBg()}); 

$(window).resize(function(){resetBg()}); 

function getObjWh(obj){ 

var st=document.documentElement.scrollTop;//滚动条距顶部的距离 

var sl=document.documentElement.scrollLeft;//滚动条距左边的距离 

var ch=document.documentElement.clientHeight;//屏幕的高度 

var cw=document.documentElement.clientWidth;//屏幕的宽度 

var objH=$("#"+obj).height();//浮动对象的高度 

var objW=$("#"+obj).width();//浮动对象的宽度

var objT=Number(st)+(Number(ch)-Number(objH))/2; 

var objL=Number(sl)+(Number(cw)-Number(objW))/2; 

return objT+"|"+objL; 

function resetBg(){ 

var fullbg=$("#fullbg").css("display"); 

if(fullbg=="block"){ 

var bH2=$("body").height(); 

var bW2=$("body").width()+16; 

$("#fullbg").css({width:bW2,height:bH2}); 

var objV=getObjWh("dialog"); 

var tbT=objV.split("|")[0]+"px"; 

var tbL=objV.split("|")[1]+"px"; 

$("#dialog").css({top:tbT,left:tbL}); 

//关闭灰色JS遮罩层和操作窗口

function closeBg(){ 

$("#fullbg").css("display","none"); 

$("#dialog").css("display","none");

</script>

css代码

#fullbg{ 

background-color: Gray; 

display:none; 

z-index:3; 

left:0px; 

opacity:0.5; top:0; left:0;height:100%; width:100%; z-index:999; position:fixed; _position:absolute; _left: expression_r(documentElement.scrollLeft + documentElement.clientWidth - this.offsetWidth); _top: expression_r(documentElement.scrollTop + documentElement.clientHeight - this.offsetHeight);

filter:Alpha(Opacity=30); 

opacity: 0.3; 

#dialog { 

width:560px; 

background:#eee; 

display: none; 

z-index: 5; 

padding:16px;

font-size:12px;

z-index:1000; position:absolute;

}

#dialog sup{ color:#f00;}

#dialog .close0{ position:relative; top:-24px; left:544px; height:38px; width:40px;}

html代码

<div id="fullbg"></div> 

<!-- end JS遮罩层-->

<!-- 对话框-->

<div id="dialog">

<div class="close0"><a href="#" onclick="closeBg();"><img src="__IMG__/close.png" /></a></div> 

<div id="dialog_content">

<h3>个人信息</h3>

<p>(备注:以下信息我们只用于根据需要给您发送相关服务材料,不会对外泄密,敬请理解)</p>

<table width="555" border="0" cellspacing="1" cellpadding="0" class="yh_table">

       <tr>

        <td width="65"

bgcolor="#eeeeee"><sup>*</sup>用户ID</td>

        <td width="100" bgcolor="#fbfbfb"><b>{$member.MEMBER_NAME}</b></td>

        <td width="65" bgcolor="#eeeeee"><sup>*</sup>真实姓名</td>

        <td width="80" bgcolor="#fbfbfb"><b>{$https://www.doczj.com/doc/873354188.html,S}</b></td>

        <td width="60" bgcolor="#eeeeee">性别</td>

        <td bgcolor="#fbfbfb"><b><php>echo $gender[$info['GENDER']];</php></b></td>

       </tr>

       <tr>

        <td bgcolor="#eeeeee"><sup>*</sup>手机号码</td>

        <td bgcolor="#fbfbfb"><b>{$info.TELEPHONE}</b></td>

        <td bgcolor="#eeeeee">电子邮箱</td>

        <td colspan="3" bgcolor="#fbfbfb"><b>{$member.EMAIL}</b></td>

       </tr>

       <tr>

        <td colspan="2" bgcolor="#eeeeee"><sup>*</sup>有效证件(身份证)</td>

        <td colspan="4" bgcolor="#fbfbfb"><b>{$info.IDS}</b></td>

       </tr>

       <tr>

        <td bgcolor="#eeeeee">通讯地址</td>

        <td colspan="3" bgcolor="#fbfbfb"><b>{$info.ADDRESS}</b></td>

        <td bgcolor="#eeeeee">邮编</td>

        <td bgcolor="#fbfbfb"><b>{$info.ZIPS}</b></td>

       </tr>

      </table>

</div> 

</div> 

静下心来,循序渐进。

以上这篇老生常谈遮罩层滚动条的问题就是小编分享给大家的全部内容了,希望能给大家一个参考

遮罩层与遮罩动画的练习导学案

遮罩层与遮罩动画的制作课堂导学案 【学习目的】 1)进一步理解遮罩的概念; 2)掌握遮罩动画的制作要领; 3)能够恰当运用遮罩层再现生活中一些有趣的情境。 【学习重点】 1)遮罩概念的理解; 2)恰当运用遮罩层再现生活中一些有趣的情境。 【学习难点】 遮罩概念的理解。 【学习方法】 让学生在欣赏-模仿-分析-探究的过程中学会学习。从生活中寻找遮罩“原型”并重现,通过主动探索、发现和体验,实现学以致用。 一、概念复习 除了普通图层、引导层外,还有一种特殊的图层——遮罩层。利用遮罩功能,可以设定显示图像的哪一部分,不显示哪一部分,以便进行一些特殊处理。由此形成的动画,就是遮罩动画。 1.遮罩动画的概念 (1)什么是遮罩 遮罩动画是Flash中的一个很重要的动画类型,很多效果丰富的动画都是通过遮罩动画来完成的。在Flash的图层中有一个遮罩图层类型,为了得到特殊的显示效果,可以在遮罩层上创建

一个任意形状的“视窗”,遮罩层下方的对象可以通过该“视窗”显示出来,而“视窗”之外的对象将不会显示。 (2)遮罩有什么用 在Flash动画中,“遮罩”主要有2种用途,一个作用是用在整个场景或一个特定区域,使场景外的对象或特定区域外的对象不可见,另一个作用是用来遮罩住某一元件的一部分,从而实现一些特殊的效果。 2.创建遮罩的方法 (1)创建遮罩 在Flash中没有一个专门的按钮来创建遮罩层,遮罩层其实是由普通图层转化的。你只要在某个图层上单击右键,在弹出菜单中选择【遮罩层】,使命令的左边出现一个小勾,该图层就会生成遮罩层,“层图标”就会从普通层图标变为遮罩层图标,系统会自动把遮罩层下面的一层关联为“被遮罩层”,在缩进的同时图标变为,如果你想关联更多层被遮罩,只要把这些层拖到被遮罩层下面就行了。 (2)构成遮罩和被遮罩层的元素 遮罩层中的图形对象在播放时是看不到的,遮罩层中的内容可以是按钮、影片剪辑、图形、位图、文字等,但不能使用线条,如果一定要用线条,可以将线条转化为“填充”。 被遮罩层中的对象只能透过遮罩层中的对象被看到。在被遮罩层,可以使用按钮,影片剪辑,图形,位图,文字,线条。

flash遮罩动画制作-红星闪闪

Flash遮罩效果实例-红星闪闪 在Flash8.0的作品中,我们常常看到很多眩目神奇的效果,而其中不少就是用最简单的“遮罩”完成的,如水波、万花筒、百页窗、放大镜、望远镜……等等。 那么,“遮罩”如何能产生这些效果呢? 在本节,我们除了给大家介绍“遮罩”的基本知识,还结合我们的实际经验介绍一些“遮罩”的应用技巧,最后,提供二个很实用的范例,以加深对“遮罩”原理的理解。 在Flash8.0中实现“遮罩”效果有二种做法,一种是用补间动画的方法,一种是用actions指令的方法,在本节中,我们只介绍第一种做法。 1.遮罩动画的概念 (1)什么是遮罩 “遮罩”,顾名思义就是遮挡住下面的对象。 在Flash8.0中,“遮罩动画”也确实是通过“遮罩层”来达到有选择地显示位于其下方的“被遮罩层”中的内容的目地,在一个遮罩动画中,“遮罩层”只有一个,“被遮罩层”可以有任意个。 (2)遮罩有什么用 在Flash8.0动画中,“遮罩”主要有2种用途,一个作用是用在整个场景或一个特定区域,使场景外的对象或特定区域外的对象不可见,另一个作用是用来遮罩住某一元件的一部分,从而实现一些特殊的效果。 2.创建遮罩的方法 (1)创建遮罩 在Flash8.0中没有一个专门的按钮来创建遮罩层,遮罩层其实是由普通图层转化的。你只要在要某个图层上单击右键,在弹出菜单中把“遮罩”前打个勾,该图层就会生成遮罩层,“层图标”就会从普通层图标变为遮罩层图标,系统会自动把遮罩层下面的一层关联为“被遮罩层”,在缩进的同时图标变为,如果你想关联更多层被遮罩,只要把这些层拖到被遮罩层下面就行了,如图3-5-1所示。

图3-5-1 多层遮罩动画 (2)构成遮罩和被遮罩层的元素 遮罩层中的图形对象在播放时是看不到的,遮罩层中的内容可以是按钮、影片剪辑、图形、位图、文字等,但不能使用线条,如果一定要用线条,可以将线条转化为“填充”。 被遮罩层中的对象只能透过遮罩层中的对象被看到。在被遮罩层,可以使用按钮,影片剪辑,图形,位图,文字,线条。 (3)遮罩中可以使用的动画形式 可以在遮罩层、被遮罩层中分别或同时使用形状补间动画、动作补间动画、引导线动画等动画手段,从而使遮罩动画变成一个可以施展无限想象力的创作空间。 3.应用遮罩时的技巧遮罩层的基本原理是:能够透过该图层中的对象看到“被遮罩层”中的对象及其属性(包括它们的变形效果),但是遮罩层中的对象中的许多属性如渐变色、透明度、颜色和线条样式等却是被忽略的。比如,我们不能通过遮罩层的渐变色来实现被遮罩层的渐变色变化。要在场景中显示遮罩效果,可以锁定遮罩层和被遮罩层。可以用“AS”动作语句建立遮罩,但这种情况下只能有一个“被遮罩层”,同时,不能设置_alpha属性。不能用一个遮罩层试图遮蔽另一个遮罩层。遮罩可以应用在gif动画上。在制作过程中,遮罩层经常挡住下层的元件,影响视线,无法编辑,可以按下遮罩层时间轴面板的显示图层轮 廓按钮,使之变成,使遮罩层只显示边框形状,在种情况下,你还可以拖动边框调整遮罩图形的外形和位置。在被遮罩层中不能放置动态文本。实例:红星闪闪

flash制作遮罩动画

第五课制作遮罩动画 Flash中的普通层是透明的,普通层叠在一起不会互相遮罩。与普通层相对应的层是“遮罩层”,“遮罩层”是不透明的,只有有图像或文字的地方才是透明的。利用遮罩层,可以制作一些特殊的动画效果。 一、探照灯效果 【例2-5.1】制作一个动画,产生文字在探照灯照射下逐步显示出来的效果。 分析:在普通层上放入文字,再建遮罩图层,遮罩图层上画一个圆。遮罩图层中的圆移动时,它下面的文字就随着显示出来了,就像探照灯将文字照出来了一样。 【操作步骤】 第一步:新建一个动画文件,将第一个图层的名字改为“文字”。 第二步:单击菜单【修改】 【文档】,设置背景色为黑色。在“文字”层的第1帧输入“欢迎光临”;在第15帧处插入帧,将第一帧延伸至第15帧。见图2-5.1。 图2-5.1 文字层 第三步:新建图形元件“圆”。见图2-5.2。

图2-5.2 图形元件“圆” 第四步:新建图层“灯”。将元件“圆”拖入第1帧的舞台左边,遮住左边的文字;在第15帧处插入关键帧,将“圆”实例移至舞台右边,遮住右边的文字;打开帧属性面板,在第1帧创建“运动补间动画”。 图2-5.3 “灯”图层动作补间动画 第五步:在“灯”图层上单击鼠标右键,选择“遮罩层”,如图2-5.4所示。 图2-5.4 遮罩层

测试影片,效果如何? 【试一试】 制作一个广告字幕效果的动画,要求文字从左到右逐步显示出来。 提示:遮罩层静止,对文字层中的文字元件作“动作补间动画”。 二、望远镜效果 【例2-5.2】运用遮罩层制作一个具有望远镜效果的Flash动画。见图2-5.5。 图2-5.5 遮罩效果 【操作步骤】 第一步:新建“风景”图形元件,导入风景图片;新建“望远镜”图形元件,画两个相交圆作为望远镜。 第二步:将元件“风景”拖入图层1的第1帧,调整到和舞台一样大小,与舞台对齐,插入静止帧至第45帧。见图2-5.6 第三步:将元件“望远镜”拖入图层2的第1帧;在第25帧插入关键帧,移动望远镜的位置。在第1帧创建“运功动画补间”。 第四步:将图层2设置为“遮罩层”。

《遮罩动画》微课解说词-修改

微课解说词 一、引入 同学们,之前,我们学过怎样制作形状渐变和运动补间动画,知道了,动画产生的原因是对象的形状、大小、颜色、位置或者透明度发生了改变。 二、案例分析,提出问题 今天还是先请大家欣赏一组动画。 在这组动画中,大家发现:字是慢慢的展开;地球在不断的旋转。也就是对象本身内容在发生改变。这种动画,单独的运用之前学过的形状渐变和运动补间是做不出来的,其实它们都运用了遮罩。什么是遮罩呢?如何应用遮罩来制作动画?是这节课所要解决的问题。 接下来,我们先通过演示来了解遮罩和它的原理。 三、遮罩的原理 打开FLASH软件 1、在图层1中导入一张图片。 (1)选择文件→导入→导入到舞台。 (2)调整图片的大小,使它跟舞台一样大。 选择相对于舞台,水平中齐,垂直中齐,匹配宽和高。 2、在图层2中绘制一个椭圆 (1)新建图层, (2)绘制一个椭圆,填充颜色可以任意设置,现在我们选择为红色。 大家可以看到,在图层为一般图层情况下:上面的图层内容会遮挡住下面的图层内容,被遮挡的下面图层的内容就看不到了。图层1的图片,有一部分就图层2的椭圆遮挡了,没有显现出来。 那我们将图层2和图层1的改变为遮罩和被遮罩,结果,又会怎么样呢? 我们现在来改变一下看看。 在图层2中,右击,选择遮罩层,这时候你们就会发现,图层的标识发生了改变,同时图层也被锁定了。 再看看舞台,大家可以看到,图层1中的图片,被图层2的椭圆遮挡的地方,显现出来了,没有被遮挡的不见了。

所以,遮罩层与一般图层产生的情况恰恰相反:遮挡的地方就会被看见,没有遮挡的地方就看不见了。下面,让我们来仔细分析一下。 遮罩原理分析: 遮罩需要两个图层,上面的图层为遮罩层,下面的图层为被遮罩层。遮罩层就好比手电筒,被遮罩层就好比黑夜中景物。电筒光照到的地方就会被看见,没有被光照到的地方就看不见。 同时也可以看出,遮罩层决定显示的轮廓形状,被遮罩层是所显示的内容。 现在我们已经弄清了遮罩及其原理。刚才看到只是静止的画面,我们可不可以让它动起来呢?刚才讲了,遮罩层就好比手电筒,被遮罩层就好比黑夜中景物。很显然,想让遮罩产生动感,无非就是两种情况:要么是手电筒动,要么是被照的物体动。也就是说,遮罩层或者被遮罩层运动就会产生庶罩动画。 我们先试一下第一种情况:遮罩层运动的遮罩动画,也就是在图层2做一个动作补间动画,让图层2的椭圆动起来。怎么做?大家还记得吗? (1)将两图层解锁进行编辑。 (2)在图层2的某一帧(就在第30帧吧)插入关键帧。 (3)右击创建补间动画。 (4)选中最后关键帧中的椭圆,将椭圆移动到某一位置。 (5)在图层1中插入普通帧,延长显示时间和图层2相同。 大家看看动画效果。 第二种情况制作和第一种相同,所不同的是,被遮罩层运动,而遮罩层不动。 (1)取消遮罩层运动。在图层2的最后一帧中清除关键帧,并且删除补间; (2)在图层1相应的帧,插入关键帧; (3)同样是创建补间动画; (4)将图片移动到行当的位置。 大家看看动画效果。 小结: 好,那么我们回忆一下遮罩原理。1、遮罩是由两个图层组成,上面的图层是遮罩层,下面的图层是被罩层;2、遮罩层决定所看到的图层形状;3、被遮罩

教案《神奇的遮罩动画》

《神奇的遮罩动画》教学设计 【课型】新授课【课时】1课时 【适用年级】七年级 【设计意图】 Flash动画制作技术性比较强,难于理解,而遮罩动画又是Flash学习的一个难点,作为一节新授课,我尝试解决两个问题,在突破难点的基础上让学生自主探究。Flash动画来源于生活,因此我以“再现生活”为整个学习的主线,让学生从生活中寻找“原型”,尝试利用动画自主探究再现,真正实现知识的触类旁通。 【教学内容分析】 《遮罩动画》是教育部中小学信息技术教育实验区教材七年级下册第二单元第5课内容。所用工具软件为FlashMX。在此之前,学生已经学习了形状补间动画、移动补间动画和引导动画,尝试用Flash再现了飞机起飞、月亮绕地球旋转、瓢虫爬行等有趣的情境。 【教学对象分析】 本课面向的是七年级的学生,他们对于Flash动画的学习有着浓厚的兴趣,具有较强的竞争意识和探索精神,但分析问题能力有待提高。 【教学目标】 1、知识与技能 1)理解遮罩的概念; 2)掌握遮罩动画的制作要领; 3)能够恰当运用遮罩层再现生活中一些有趣的情境。 2、过程与方法 让学生在欣赏-模仿-分析-探究的过程中学会学习。 3、情感、态度、价值观 1)激发学生的学习兴趣; 2)提高学生自主探究意识。 【教学重点、难点】 教学重点: 1)遮罩概念的理解; 2)恰当运用遮罩层再现生活中一些有趣的情境。 教学难点: 遮罩概念的理解。 【教法分析】 抛锚式教学法:以引导动画知识为基础搭建“脚手架”,借助影片中的望远镜情境设置锚点,引入本课,练习设置以基础练习-巩固练习-进阶挑战层层递进的方式进行。 分层教学法:组织学生根据自身的实际情况完成适合自己的实践探究活动。 【学法分析】 探究性学习:给学生创设一个探究情境——从生活中寻找遮罩“原型”并重现,让他们通过主动探索、发现和体验,实现学以致用。 【教具准备】 网络教室(安装红蜘蛛电子教室软件)、辅助学习网站、课件。 【简明教学流程】

flash遮罩动画教学设计

FLASH遮罩动画教学设计 安康育英中等职业学校周开波 课型:新授课 授课年级:中职二年级 课时安排:1课时 教学目标: (1)理解遮罩动画的实现原理; (2)掌握Flash遮罩动画的制作方法; (3)掌握遮罩动画的制作要点 (4)引导学生养成良好的操作习惯和思维习惯,提高学生审美能力和空间想像能力,激发学生自主创意。 (5)感受运用Flash动画软件创造作品的乐趣; (6)体验作品创作成功的喜悦和成就感,激发学习flash的兴趣。 教学重点: (1)遮罩动画的实现原理; (2)遮罩动画的制作过程; 教学难点: 遮罩动画的实现原理; 教学对象分析 学生在之前已经学习过了逐帧动画、补间动画、引导层动画,遮罩动画是flash中需要学习的最后一种动画形式,学生已经对图层、元件、库有了一定的了解,基于本班学生女生多,实践操作的主动性不高和计算机课的特点,周期长、学生易忘、操作性强,在教学中尽量激发学生的发散思维,让学生在渴望中积极探究,自主的学习,并通过分析源文件,从中真正理解其制作过程。学生自我表现力强,尽量给学生多练,多展示的机会。培养学生科学严谨的学习态度和良好的操作习惯,并培养学生热爱自然的情趣。 教学方法与教学手段: 讲授法、演示法、任务驱动法。 教学准备: 硬件:多媒体计算机、投影仪; 软件:教学课件。 教学过程:

板书设计:以课件的形式在大屏幕上播放。 教学后记: 本课题在课前的教学设计中就力争能做到:以学生为中心,以教师为引导;知识的展现通过学生自己的探究得到,而不是教师的灌输;在教学过程中,循序渐进,尽量能激发学生求知的热情,学习的兴趣,让学生积极主动地参与到教学活动中来,能在教师的引导下进行有效的探究活动。在实际教学活动中也基本上实现了这种设计,师生之间进行了有效的互动,通过学生的自主探究学习,很好的达成了本节课的教学目标。

Flash遮罩动画详解及实例

Flash 8 遮罩动画详解及实例 在Flash8.0的作品中,我们常常看到很多眩目神奇的效果,而其中不少就是用最简单的“遮罩”完成的,如水波、万花筒、百页窗、放大镜、望远镜……等等。 那么,“遮罩”如何能产生这些效果呢? 在本节,我们除了给大家介绍“遮罩”的基本知识,还结合我们的实际经验介绍一些“遮罩”的应用技巧,最后,提供二个很实用的范例,以加深对“遮罩”原理的理解。 在Flash8.0中实现“遮罩”效果有二种做法,一种是用补间动画的方法,一种是用actions指令的方法,在本节中,我们只介绍第一种做法。 1.遮罩动画的概念 (1)什么是遮罩 “遮罩”,顾名思义就是遮挡住下面的对象。 在Flash8.0中,“遮罩动画”也确实是通过“遮罩层”来达到有选择地显示位于其下方的“被遮罩层”中的内容的目地,在一个遮罩动画中,“遮罩层”只有一个,“被遮罩层”可以有任意个。 (2)遮罩有什么用 在Flash8.0动画中,“遮罩”主要有2种用途,一个作用是用在整个场景或一个特定区域,使场景外的对象或特定区域外的对象不可见,另一个作用是用来遮罩住某一元件的一部分,从而实现一些特殊的效果。 2.创建遮罩的方法 (1)创建遮罩 在Flash8.0中没有一个专门的按钮来创建遮罩层,遮罩层其实是由普通图层转化的。你只要在要某个图层上单击右键,在弹出菜单中把“遮罩”前打个勾,该图层就会生成遮罩层,“层

图标”就会从普通层图标变为遮罩层图标,系统会自动把遮罩层下面的一层关联为“被遮罩层”,在缩进的同时图标变为,如果你想关联更多层被遮罩,只要把这些层拖到被遮罩层下面就行了,如图3-5-1所示。 图3-5-1 多层遮罩动画 (2)构成遮罩和被遮罩层的元素 遮罩层中的图形对象在播放时是看不到的,遮罩层中的内容可以是按钮、影片剪辑、图形、位图、文字等,但不能使用线条,如果一定要用线条,可以将线条转化为“填充”。 被遮罩层中的对象只能透过遮罩层中的对象被看到。在被遮罩层,可以使用按钮,影片剪辑,图形,位图,文字,线条。 (3)遮罩中可以使用的动画形式 可以在遮罩层、被遮罩层中分别或同时使用形状补间动画、动作补间动画、引导线动画等动画手段,从而使遮罩动画变成一个可以施展无限想象力的创作空间。 3.应用遮罩时的技巧遮罩层的基本原理是:能够透过该图层中的对象看到“被遮罩层”中的对象及其属性(包括它们的变形效果),但是遮罩层中的对象中的许多属性如渐变色、透明度、颜色和线条样式等却是被忽略的。比如,我们不能通过遮罩层的渐变色来实现被遮罩层的渐变色变化。要在场景中显示遮罩效果,可以锁定遮罩层和被遮罩层。可以用“AS”动作语句建立遮罩,但这种情况下只能有一个“被遮罩层”,同时,不能设置_alpha属性。不能用一个遮罩层试图遮蔽另一个遮罩层。遮罩可以应用在gif动画上。在制作过程中,遮罩层经常挡住下层的元件,影响视线,无法编辑,可以按下遮罩层时间轴面板的显示图层轮廓按钮,使之变成,使遮罩层只显示边框形状,在种情况下,你还可以拖动边框调整遮罩图形的外形和位置。在被遮罩层中不能放置动态文本。实例:红星闪闪

遮罩动画详解

遮罩动画详解 在Flash8.0的作品中,我们常常看到很多眩目神奇的效果,而其中不少就是用最简单的“遮罩”完成的,如水波、万花筒、百页窗、放大镜、望远镜……等等。 那么,“遮罩”如何能产生这些效果呢? 在本节,我们除了给大家介绍“遮罩”的基本知识,还结合我们的实际经验介绍一些“遮罩”的应用技巧,最后,提供二个很实用的范例,以加深对“遮罩”原理的理解。 在Flash8.0中实现“遮罩”效果有二种做法,一种是用补间动画的方法,一种是用actio ns指令的方法,在本节中,我们只介绍第一种做法。 1.遮罩动画的概念 (1)什么是遮罩 “遮罩”,顾名思义就是遮挡住下面的对象。 在Flash8.0中,“遮罩动画”也确实是通过“遮罩层”来达到有选择地显示位于其下方的“被遮罩层”中的内容的目地,在一个遮罩动画中,“遮罩层”只有一个,“被遮罩层”可以有任意个。 (2)遮罩有什么用 在Flash8.0动画中,“遮罩”主要有2种用途,一个作用是用在整个场景或一个特定区域,使场景外的对象或特定区域外的对象不可见,另一个作用是用来遮罩住某一元件的一部分,从而实现一些特殊的效果。 2.创建遮罩的方法 (1)创建遮罩

在Flash8.0中没有一个专门的按钮来创建遮罩层,遮罩层其实是由普通图层转化的。你只要在要某个图层上单击右键,在弹出菜单中把“遮罩”前打个勾,该图层就会生成遮罩层,“层图标”就会从普通层图标变为遮罩层图标,系统会自动把遮罩层下面的一层关联为“被遮罩层”,在缩进的同时图标变为,如果你想关联更多层被遮罩,只要把这些层拖到被遮罩层下面就行了,如图3-5-1所示。 图3-5-1 多层遮罩动画 (2)构成遮罩和被遮罩层的元素 遮罩层中的图形对象在播放时是看不到的,遮罩层中的内容可以是按钮、影片剪辑、图形、位图、文字等,但不能使用线条,如果一定要用线条,可以将线条转化为“填充”。 被遮罩层中的对象只能透过遮罩层中的对象被看到。在被遮罩层,可以使用按钮,影片剪辑,图形,位图,文字,线条。 (3)遮罩中可以使用的动画形式 可以在遮罩层、被遮罩层中分别或同时使用形状补间动画、动作补间动画、引导线动画等动画手段,从而使遮罩动画变成一个可以施展无限想象力的创作空间。 3.应用遮罩时的技巧遮罩层的基本原理是:能够透过该图层中的对象看到“被遮罩层”中的对象及其属性(包括它们的变形效果),但是遮罩层中的对象中的许多属性如渐变色、透明度、颜色和线条样式等却是被忽略的。比如,我们不能通过遮罩层的渐变色来实现被遮罩层的渐变色变化。要在场景中显示遮罩效果,可以锁定遮罩层和被遮罩层。可以用“AS”动作语句建立遮罩,但这种情况下只能有一个“被遮罩层”,同时,不能设置_alpha属性。不能

Flash教程(七) 遮罩层动画

遮罩动画 在Flash作品中,常常可以看到很多眩目神奇的效果,而其中不少就是用“遮罩”动画完成的,如水波、万花筒、百叶窗、放大镜等动画效果。 那么,“遮罩”动画如何能产生这些特效呢?在本节,我们除了给大家介绍“遮罩”动画的基本知识外,还要结合实际范例讲解“遮罩”动画的制作方法和技巧。 遮罩动画的制作方法 遮罩动画的原理是,在舞台前增加一个类似于电影镜头的对象。这个对象不仅仅局限于圆形,可以是任意形状。将来导出的影片,只显示电影镜头“拍摄”出来的对象,其他不在电影镜头区域内的舞台对象不再显示。 遮罩效果的获得一般需要两个图层,这两个图层是被遮罩的图层和指定遮罩区域的遮罩图层。实际上,遮罩图层是可以应用于多个图层的。 遮罩图层和被遮罩图层只有在锁定状态下,才能够在工作区中显示出遮罩效果。解除锁定后的图层在工作区中是看不到遮罩效果的。 下面通过具体的操作来讲解遮罩动画的制作方法。 (1)新建一个Flash CS3影片文档,保持文档属性的默认设置。 (2)导入一个外部图像(草原.jpg)到舞台上。 (3)新建一个图层,在这个图层上用“椭圆工具”绘制一个五角星(无边框,任意色)。我们计划将这个圆当做遮罩动画中的电影镜头对象来用。 现在,影片有两个图层,“图层1”上放置的是导入的图像,“图层2”上放置的是五角星(计划用做电影镜头对象)。如图1所示。 图1 舞台效果 (4)下面来定义遮罩动画效果。右击“图层2”,在弹出的快捷菜单中选择“遮罩层”命令。图层结构发生了变化。如2所示。 2 遮罩图层结构 我们注意观察一下图层和舞台的变化。 “图层1”:图层的图标改变了,从普通图层变成了被遮罩层(被拍摄图层)。并且图层缩进,图层被自动加锁。 “图层2”:图层的图标改变了,从普通图层变成了遮罩层(放置拍摄镜头的图层)。并且图

遮罩动画教案设计

《遮罩动画》教案设计 江川职中陈冬艳一、教学设计指导思想 本节课以“项目教学法”为主要思想。在项目教学中,学习过程成为一个人人参与的创造实践活动,注重的不是最终的结果,而是完成项目的过程。学生在项目实践过程中,理解和把握课程要求的知识和技能,培养分析问题和解决问题的思想和方法。学生在教师的指导下亲自处理一个项目的全过程,在这一过程中学习掌握教学计划内的教学内容。学生全部或部分独立组织、安排学习行为,解决在处理项目中遇到的困难,提高了学生的兴趣,自然能调动学习的积极性。因此“项目教学法”是一种典型的以学生为中心的教学方法。 本节课的设计思想是:从知识、情感两个方面对学生进行知识传授和能力培养,运用循序渐进的任务驱动教学方法,使学生处于“探究”状态,激活学生思维和情感,重在培养学生自信心及合作意识。 二、教材分析 本节课选用的教学内容是中等职业学校计算机系列教材《动画设计与制作——FLASH 8》项目五的内容。在学习本节课之前,学生已经掌握了FLASH中动作补间动画、形状补间动画及引导层动画,FLASH所提供的遮罩动画,可以产生丰富多彩的效果,例如:水中倒影效果、卷轴画、烟花等等。因此,掌握本节内容可以做出许多生动有趣的动画。 遮罩层和引导层一样,是FLASH中的特殊图层,灵活地将遮罩动画与其他FLASH技术配合使用,可以使作品更丰富、更精彩。 三、学情分析 本节课的教学对象是计28班的全体同学,该班学生为高二年级上学期,他们想象力丰富,好奇心强,同时又有了一定的自学能力和动手能力。学生通过前面的学习已经熟悉Flash的界面,动画原理、帧的基本概念,熟悉并进行了工具箱的一些操作,大部分学生会创建补间动画、创建引导层动画,能够从外部导入文件到库,本节在补间动画及引导层动画的基础上深入学习。 四、学习目标 ◆知识目标 1、理解遮罩动画产生的原理; 2、理解遮罩层与被遮罩层的概念。 3、掌握使用遮罩原理制作动画的方法和技巧。 ◆能力目标 能够运用所学制作动画技巧,创作动画作品

最新整理小学信息技术《flash遮罩动画》教案.docx

最新整理小学信息技术教案《flash遮罩动画》教案《flash遮罩动画》教案 教材分析 本节课以山西经济出版社的《信息技术》教学内容为依据拓展开来讲授的。本节课的教学内容是flash的“遮罩动画制作”。作为拓展课,着重于学生对遮罩动画的原理理解以及制作简单的遮罩效果动画,进一步提升学生动画制作技能水平。 学情分析 由于新教材上没有专门安排遮罩动画的这一章节,但是学生前面已学习过的基本动画又不能满足学生的认知拓展需要,学生在掌握简单的逐帧动画、动作补间以及形状补间之后,渴望掌握更深的操作技能,本课学生通过学习flash遮罩动画的制作原理及基本应用,培养学生深入学习flash的兴趣以及动手探究实践的学习能力。 教学目标 1.知识与技能 (1)掌握遮罩动画的基本原理; (2)理解遮罩层与被遮罩层之间的关系; (3)利用遮罩知识,学会探照灯、动感文字效果动画的制作; 2.过程与方法 (1)通过分析遮罩实例,掌握遮罩制作的三步骤,加深对遮罩原理的理解; (2)通过制作遮罩实例,提高学生灵活运用遮罩效果的应变能力; 3.情感态度与价值观 (1)培养学生深入学习flash的兴趣,体验作品创作成功的喜悦和成就感;

(2)通过知识点的迁移,培养学生创新精神和应变能力; 教学重点与难点 1.教学重点 遮罩的原理和遮罩效果的制作三步骤方法。 2.教学难点 理解遮罩与被遮罩层的关系。 教法、学法 讲授法、演示法、分层任务驱动法、自主探究学习法。 教学准备 多媒体网络教室,遮罩动画案例 课时安排 安排1课时。 教学过程 一、实例导入 展示动画片《猫和老鼠》中的灯塔在夜晚照来照去的影片片段,同时展示几个有遮罩动画效果的实例,导入本节课的内容:flash遮罩动画。 学生欣赏作品,激发学习兴趣,明确本节课目标 设计意图:通过展示丰富的遮罩实例,激发学生的学习兴趣,引导学生思考,导出本课教学内容。 二、探究新知 1.实例分析 以“探照灯效果”为例,通过网络教学软件展示源文件时间轴面板,帮助学生共同分析动画的构成。

遮罩层动画教案

遮罩层动画教案 职业学校 计算机说课 授课人,姚即苓 单位,泰安市岱岳区职业中专 《二维动画制作》――遮罩层动画泰安市岱岳区职业中专姚即苓 遮罩层动画【课题】 遮罩层动画 (高等教育出版社《二维动画制作》第三章第五节) 【课时】 3课时(3*45分钟) 【学情分析】 学生已经学习了Flash的基本操作,掌握了制作简单动画的基本方法和步骤,具备了一 定的分析解决问题的能力。多数学生对Flash的学习有相当高的兴趣和积极性,但在操作技巧 和创新应用上有待加强。 【教学目标】 1、认知目标:理解遮罩层的概念,掌握遮罩层动画的制作方法。 2、能力目标:熟练操作遮罩层,培养探究学习能力和创新能力。 3、情感目标:培养学生的协作、实践等精神。 【重点难点】 重点:遮罩层动画的制作及创新应用。

难点:遮罩层的概念和遮罩层动画的制作技巧。 【教学方法】 1、采用情境案例、自主合作式教学法。 2、采取了由浅入深、循序渐进的教学策略。 【学法】 自主探究法与分组合作法 【教学环境】 多媒体网络教室、多媒体课件、自制的遮罩演示教具 第 2 页共 6 页 《二维动画制作》――遮罩层动画泰安市岱岳区职业中专姚即苓【教学过程】 教学环节教师活动学生活动设计意图效果图一、创情境,激发学生的学习兴趣。 导教师展示3个已做好欣赏动画。在短时展示3个已做好遮罩入遮罩层动画。间内体验遮罩层动层动画,配有音乐,新画的魅力形象、生动的展示给课学生,激发学生的学 习兴趣。

二、理解概念,为遮罩层动画的制作打下坚实的基础。 遮 1、借助自制演示教具1、借助自制教具,借助自制教具,学生罩现场模拟效果。边讲解直观认识遮罩层。对遮罩层的概念有层边模拟。 2、学生分组讨论,具体形象的认识,便的 2、提出问题:遮罩层归纳总结并展示。于难点的突破。概与普通层相比有哪些 念特点, 1、提出任务: 1、学生阅读教材,通过把遮罩层与被 制作红色矩形遮罩蓝找步骤,上机实践。遮罩层的位置互换, 色文字的静态遮罩效2、对比效果,试着使学生现场看到不 果。归纳遮罩层的概一样的遮罩效果,经 2、如果把“文字层”念。过辨析归纳了遮罩 与“矩形层”互换位置,层的概念,进而突破 再设置遮罩会出现什了难点。 么效果呢,

《FLASH遮罩动画》教学设计与反思

《FLASH遮罩动画》教学设计与反思 ■教材分析 本节课以新教材苏科版的《初中信息技术》(下册)第八单元教学内容为依据拓展开来讲授的。本节课的教学内容是flash的“遮罩动画制作”。作为拓展课,着重于学生对遮罩动画的原理理解以及制作简单的遮罩效果动画,进一步提升学生动画制作技能水平。 ■学情分析 由于新教材上没有专门安排遮罩动画的这一章节,但是学生前面已学习过的基本动画又不能满足学生的认知拓展需要,学生在掌握简单的逐帧动画、动作补间以及形状补间之后,渴望掌握更深的操作技能,本课学生通过学习flash遮罩动画的制作原理及基本应用,培养学生深入学习flash的兴趣以及动手探究实践的学习能力。 ■教学目标 1.知识与技能 (1)掌握遮罩动画的基本原理; (2)理解遮罩层与被遮罩层之间的关系; (3)利用遮罩知识,学会探照灯、动感文字效果动画的制作; 2.过程与方法 (1)通过分析遮罩实例,掌握遮罩制作的三步骤,加深对遮罩原理的理解; (2)通过制作遮罩实例,提高学生灵活运用遮罩效果的应变能力; 3.情感态度与价值观 (1)培养学生深入学习flash的兴趣,体验作品创作成功的喜悦和成就感; (2)通过知识点的迁移,培养学生创新精神和应变能力; 4.行为与创新 通过遮罩原理的学习,能够让学生根据实际需求学以致用,制作自己的遮罩动画 ■课时安排 安排1课时。 ■教学重点与难点 1.教学重点 遮罩的原理和遮罩效果的制作三步骤方法。 2.教学难点 理解遮罩与被遮罩层的关系。 ■教学方法与手段 讲授法、演示法、分层任务驱动法、自主探究学习法。 ■课前准备 多媒体网络教室,网页学件 ■教学过程 教学 环节 教学活动学生活动设计意图 实例导入【新课导入】 展示动画片《猫和老鼠》中的灯塔在夜晚照来照去的影 片片段,同时通过网页学件(登录网址:http://192.168.0.1) 展示几个遮罩动画效果的实例, 导入本节课的内容:flash遮罩 学生欣赏作品 激发学习兴趣 明确本节课目标 通过展示丰富的遮罩 实例,激发学生的学 习兴趣,引导学生思 考,导出本课教学内 容。

相关主题
文本预览
相关文档 最新文档