分享
 
 
 

在Flash中调用Html的层

王朝html/css/js·作者佚名  2006-11-24
窄屏简体版  字體: |||超大  

本教程需要大家有一些关于HTML, CSS, Flash, JavaScript 和ASP的基础知识

用Html文本与Flash一起来制作动画是一个很好的方式。 它非常的简单, 而且容易上手,只需要使用ActionScript中的getURL()脚本就可以了,比你能想象到的任何其他编成语言(例如JavaScript)都更方便,功能也更强大。

请看下面这个情节: 在一个特殊工程中,设计师需要Flash 动画运行于页面的顶端,然后在Flash播放后,再显示文本。你可以在Flash中做很多的事情,但是在这例子中不适合用它来在HTML的层中显示文本。

第一步:布局

首先创建一个包含层的网页(如果你对层这个概念不熟悉,可以在Google中搜索一下,你会发现有很多有用的东西,是很值得你花点时间看一下的)。在我的例子中,使用了一个导航层,一个用来显示文本内容的层和一个Flash层,如下图所示:

我在下面用到的效果是在Flash影片完成播放前隐藏文本内容层,所以第一件要做的事情就是设置层的可见属性为隐藏,其他两个层保持默认的可见属性。

第二步: JavaScript

这里我说明一下: 我是使用Dreamweaver的内置的显示/隐藏脚本,并把它插入到网页的头部。

无论是自己写的JavaScript脚本,还是从脚本库或者DreamWeaver中拖动一个,你都可以切换图层的显示和隐藏了。使用这个脚本,可以很快地写出自己想要的简单JavaScript函数。

上图中的模型实际上要比这个完成的功能更简单。 实际上,一共三个层----内容层和两个包含鼠标上下箭头图形的层,它们是用来滚动内容层的。这些都是需要隐藏直到影片播放完成的东西。这里我没有在flash的时间轴中创建四个不同的脚本,而是创建了一个JavaScript脚本来很快的显示所有层:

<script language="JavaScript" type="text/javascript">

<!--

function MM_findObj(n, d) { //v4.01

var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length)

{

d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++)

x=d.forms[i][n];

for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

if(!x && d.getElementById) x=d.getElementById(n); return x;

}

function MM_showHideLayers() { //v3.0

var i,p,v,obj,args=MM_showHideLayers.arguments;

for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null)

{ v=args[i+2];

if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v='hide')?'hidden':v;

}

obj.visibility=v; }

}

function showLayers() {

MM_showHideLayers('content','','show')

MM_showHideLayers('divUpControlMain','','show')

MM_showHideLayers('divDownControlMain','','show')

}

-->

</script>

非常的简单! 正如所看到的,所有我需要做的就是为每个需要显示的层创建一个脚本函数。 我不是一个很强的JavaScript程序员,肯定还有更好的方式来实现它。

第三步:在Flash中调用这个函数

在flash影片的时间轴上需要出现文本内容层的地方插入下面脚本:

getURL("javascript:showLayers()");

现在,在HTML网页中的隐藏的层,就可以通过Flash影片来控制它在适当的时候显示出来。但这仍然有个问题,用户每次打开网页,都需要耐心看完影片才能看到内容文本。下面是我的解决方案。

第四步:挽救人们的耐心

当用户第一次访问这个页面的时候,可以做个Cookie记录,当用户再次访问的时候,服务器读取Cookie就可以知道他们是否已经看过影片了。如果用户已经看过影片了,就可以用最后的一帧和一个小的播放按钮来代替影片, 用户就可以直接看到文本内容了。利用Google,花点时间你可以用Perl,PHP,JavaScript等任意一种语言来做这个功能。这里ASP是我所选择的武器。代码一共有两部分:

1)检查Cookie并显示适当的内容:

2)窗体顶端

<div id="Flash" style="position:absolute; left:0; top:0; width:760;

height:160; z-index:1; visibility: visible">

<%

If Request.Cookies("viewed")("force") = "" Then

%>

<p><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"

codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=4,0,2,0"

width="760" height="160">

<param name="movie" value="swf/force.swf">

<param name=quality value=high>

<param name="loop" value="false">

<param name="menu" value="false">

<embed src="swf/force.swf" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"

type="application/x-shockwave-flash" width="760" height="160"

loop="false" menu="false">

</embed>

</object></p>

<%

Else

%>

<p><img src="img/stills/force.jpg" width="760" height="160"

border="0"></p>

<script language="JavaScript" type="text/javascript">

showLayers()

</script>

<%

End If

%>

</div>

简单点来说就一个语句---如果Cookie为空或者不存在则嵌入Flash影片(在播放完之后会显示隐藏的层),否则显示最后一帧的JPG图片来切换隐藏的层。

2) 写cookie

<% Response.Cookies("viewed")("force") = "True" Response.Cookies("viewed").Expires = Date + 90 %>

只要用户访问了本页面并且是在浏览器中第一次浏览, 就会写入Cookie,以后再浏览的时候就不会再受影片的打扰了。还剩下一件事情就是如果他们想再次观看影片怎么办?我做一个简单脚本clear.asp 和一个'重播'链接:

<a href="clear.asp?url=force.asp&cookie=force">重播</a>

如你所看到的,这个链接会清除掉Cookie,代码如下(ASP中):

<% strURL = Request.QueryString("url") strCookie = Request.QueryString("cookie") Response.Cookies("viewed")(strCookie) = "" Response.Redirect strURL %>

所有我要做的就是从query字符串中得到这个URL和Cookie的名字,删除相应的cookie并且重新定位到用户打开过的页面。为什么要这样做呢?因为简单的在同一个页面中清除cookie是不起作用的,已经太迟了。你需要重新装载一下这个页面,这就是我的解决方案,所有的已经做完了并且它运行的非常出色。

* 已经在IE5、IE 6, Mozilla 和Netscape中通过测试

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
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- 王朝網路 版權所有