站长胡同站--关注草根站长成长历程!

查看完整版本: 让Flash网站具有IE前进后退的功能

admin 2008-1-5 22:40

让Flash网站具有IE前进后退的功能

<P><STRONG>前言</STRONG>:</P><P>写完流量统计的教程以后,本以为会很轻松地就可以完成该篇文章。后来才发现,原来还是遇到了困难。因为要通过iframe控制主HTML的变量,一开始,考虑到打开父窗口用的是_parent,而Flash里的父级也是_parent,于是理所当然地以为iframe访问主html也是通过_parent,结果,弄了很久,还是提示_parent未定义。<BR>为此,我百度了下,看如何通过iframe访问主html。晕,原来这个是没有下划线的,于是改了下,发现有新的问题,就是提示“没有权限”的错误。在之前玩反编译的游戏中遇到了这个问题,是跨域访问导致的。奇怪了,我的文件都在本地啊,怎么不行呢?折磨了半小时,决定还是用IIS来测试吧。嗯,IIS成功了。难道file协议也没有权限?还是识别不了域名?这个我就没研究下去了。</P><P><STRONG>效果预览</STRONG>(应wolf2999的要求,这次我就不放超女的东西上去了,而且我网站现在加这功能还有点麻烦,因为结构有点复杂:<BR><A href="http://hbro.cincn.com/hbro/course/FlashWebForwardBack/index_flash.html#page1" target=_blank><U>http://hbro.cincn.com/hbro/cours ... ex_flash.html#page1</U></A></P><P>点左边一排的按钮,你会发现在动画效果跳转的过程中,地址栏发生了改变,但是明显的是Flash没有刷新,同时后退按钮已经可用。你多点几次以后,尝试按后退按钮,Flash也同样不刷新,但是它会依此通过动画跳转到你之前点过的page。<BR>这样,就是通过IE的按钮控制Flash的程序了。但是,实质上,是有个iframe在刷新的,所以,如果网速慢,并且点得很快,就将导致某些页面给跳过。</P><P><STRONG>实现原理</STRONG>:</P><P>找了很多方面的资料,本来想向IE的历史记录里人为添加asfunction协议的地址,但是发现似乎不可能,在Digi的提点下,我知道了可以通过刷新iframe来达到控制的目的。其过程为:</P><UL><LI>在Flash里点击一个所谓的链接,执行一个动作。该状态的一些参数用getURL到iframe里的一个固定页面。比如说,我点了page1,那么getURL的地址将是statistics.html?page1 <LI>点击几次以后,iframe其实已经刷新了几次,于是才会启用后退的功能,这个时候,其实iframe已经打开过了几个页面,假如你依此点了page1,page2,page3,page4这四个按钮,那么,iframe就浏览了statistics.html?page1,statistics.html?page2,statistics.html?page3,statistics.html?page4这四个页面了。最终定位在statistics.html?page4 <LI>此时点IE的后退按钮,iframe将返回statistics.html?page3。但是单纯这样并不会让Flash受到控制。所以,我们需要在statistics.html打开的时候,启用一个控制Flash的函数,就实现IE后退的功能了。前进的道理也一样。</LI></UL><P><STRONG>具体做法</STRONG>:</P><P>1.1 新建一个Flash文档,保存为index_flash.fla</P><P>1.2 在该文档里新建一个MC,名为pagesButtons_clip,在里头放一个按钮,写入代码:</P><P><SPAN class=code>on (release) {<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; _parent.loadNews(_name);//该函数用于Flash内的页面跳转。<BR>&nbsp;&nbsp; }</SPAN></P><P>1.3 再载入一个动态文本,变量名为_name</P><P>1.4 在主场景里放入四个pagesButton_clip,分别命名为page1,page2,page3,page4</P><P>1.5 在主场景新建一个MC,实例名为pages,在里头放入实例名为page1,page2,page3,page4的MC。</P><P>1.6 在适当的位置给pages建立一个遮罩mask。</P><P>1.7 下面可以写代码了,这次跳转,我会让相应的page定位至mask那里,从而让该页面显示,其它则隐藏。<BR>主场景的帧里写:</P><P><SPAN class=code>var initx = mask._x;//首先定位一个初始点,这是页面定位的常量<BR>var inity = mask._y;//同上<BR>var targetx=initx;<BR>var targety=inity;//这两个变量也用于定位,使用韩式缓冲公式算法,可以让MC缓慢地移动到(targetx,targety)这一点。<BR>this.onEnterFrame = function() {<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pages._x = pages._x-0.2*(pages._x-pages.targetx);<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pages._y = pages._y-0.2*(pages._y-pages.targety);<BR>};//这个则是缓冲公式<BR>function loadNews(href) {//定义按钮触发的函数<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pages.targetx = initx-pages[href]._x;<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pages.targety = inity-pages[href]._y;//先让target定位至当前MC(也就是传入的参数href),然后缓冲公式会让当前传入的MC显示出来,其它的则隐藏<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fscommand("setAddress", href);//设定地址栏内容,用于刷新页面时的定位,在JS里会响应这一命令。<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; getURL("statistics.html?"+href, "stat");//打开iframe,让iframe记录当前点到的MC的实例名href<BR>} </SPAN></P><P>2.1 以带有fscommand跟踪的Flash发布一个HTML文件和一个SWF文件,接着把发布设置中格式选项卡的HTML勾去掉。</P><P>2.2 用记事本打开index_flash.html文件,找到//place your code here 一句。写入</P><P><SPAN class=code>if(command=="setAddress"){<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; document.location.hash=args<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }</SPAN></P><P>2.3 然后定义一个onLoad执行的函数JS_LoadNews</P><P><SPAN class=code>&nbsp; function JS_LoadNews(){<BR>&nbsp; window.open("statistics.html?"+document.location.hash.slice(1),"stat")//让名为stat的iframe打开一个带参数的地址<BR>}</SPAN></P><P>2.4 根据上一步的JS,加一个iframe</P><P><SPAN class=code>&lt;iframe noscroll border="0" src="about:blank" width="1" height="1" name="stat" id="stat"&gt;&lt;/iframe&gt;</SPAN></P><P>2.5 在body标签里加onload=JS_LoadNews() </P><P>3.1 新建一个HTML文件,名为statistics.html,在这里写入控制Flash的代码:</P><P><SPAN class=code>&lt;script language="javascript"&gt;<BR>&nbsp; function pageLoad(){<BR>&nbsp;&nbsp;&nbsp; window.parent.index_flash.setVariable("link",window.document.location.search.slice(1))//parent指父级框架,这里可以指向FLASH文件,location.search是获取地址参数,该值包含“?”,所以用slice(1)去掉。<BR>&nbsp; }<BR>&lt;/script&gt;<BR>&lt;body onload=pageLoad()&gt;<BR>&lt;/body&gt;</SPAN></P><P>3.2 上面的代码设置了Flash里的link值,为了触发Flash的函数,在Flash里用addProperty来触发相关函数:<BR>&nbsp; 追加帧代码:</P><P><P><SPAN class=code></P><P>&nbsp; this.addProperty("link", getLink, setLink);<BR>function getLink() {<BR>}<BR>function setLink(link) {<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fscommand("setAddress", link);<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pages.targetx = initx-pages[link]._x;<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pages.targety = inity-pages[link]._y;<BR>} </P></SPAN>
页: [1]
查看完整版本: 让Flash网站具有IE前进后退的功能