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

Flash全站的技术应用系列
(一)AS+JS的Flash网站无刷新定位技术 
(二)Flash网站的SEO
(三)Flash网站的流量统计
(四)让Flash网站具有IE前进后退的功能 (本文)

前言

写完流量统计的教程以后,本以为会很轻松地就可以完成该篇文章。后来才发现,原来还是遇到了困难。因为要通过iframe控制主HTML的变量,一开始,考虑到打开父窗口用的是_parent,而Flash里的父级也是_parent,于是理所当然地以为iframe访问主html也是通过_parent,结果,弄了很久,还是提示_parent未定义。
为此,我百度了下,看如何通过iframe访问主html。晕,原来这个是没有下划线的,于是改了下,发现有新的问题,就是提示“没有权限”的错误。在之前玩反编译的游戏中遇到了这个问题,是跨域访问导致的。奇怪了,我的文件都在本地啊,怎么不行呢?折磨了半小时,决定还是用IIS来测试吧。嗯,IIS成功了。难道file协议也没有权限?还是识别不了域名?这个我就没研究下去了。

效果预览(应wolf2999的要求,这次我就不放超女的东西上去了,而且我网站现在加这功能还有点麻烦,因为结构有点复杂:
http://hbro.cincn.com/hbro/cours ... ex_flash.html#page1

点左边一排的按钮,你会发现在动画效果跳转的过程中,地址栏发生了改变,但是明显的是Flash没有刷新,同时后退按钮已经可用。你多点几次以后,尝试按后退按钮,Flash也同样不刷新,但是它会依此通过动画跳转到你之前点过的page。
这样,就是通过IE的按钮控制Flash的程序了。但是,实质上,是有个iframe在刷新的,所以,如果网速慢,并且点得很快,就将导致某些页面给跳过。

实现原理

找了很多方面的资料,本来想向IE的历史记录里人为添加asfunction协议的地址,但是发现似乎不可能,在Digi的提点下,我知道了可以通过刷新iframe来达到控制的目的。其过程为:

  • 在Flash里点击一个所谓的链接,执行一个动作。该状态的一些参数用getURL到iframe里的一个固定页面。比如说,我点了page1,那么getURL的地址将是statistics.html?page1
  • 点击几次以后,iframe其实已经刷新了几次,于是才会启用后退的功能,这个时候,其实iframe已经打开过了几个页面,假如你依此点了page1,page2,page3,page4这四个按钮,那么,iframe就浏览了statistics.html?page1,statistics.html?page2,statistics.html?page3,statistics.html?page4这四个页面了。最终定位在statistics.html?page4
  • 此时点IE的后退按钮,iframe将返回statistics.html?page3。但是单纯这样并不会让Flash受到控制。所以,我们需要在statistics.html打开的时候,启用一个控制Flash的函数,就实现IE后退的功能了。前进的道理也一样。

具体做法

1.1 新建一个Flash文档,保存为index_flash.fla

1.2 在该文档里新建一个MC,名为pagesButtons_clip,在里头放一个按钮,写入代码:

on (release) {
       _parent.loadNews(_name);//该函数用于Flash内的页面跳转。
   }

1.3 再载入一个动态文本,变量名为_name

1.4 在主场景里放入四个pagesButton_clip,分别命名为page1,page2,page3,page4

1.5 在主场景新建一个MC,实例名为pages,在里头放入实例名为page1,page2,page3,page4的MC。

1.6 在适当的位置给pages建立一个遮罩mask。

1.7 下面可以写代码了,这次跳转,我会让相应的page定位至mask那里,从而让该页面显示,其它则隐藏。
主场景的帧里写:

var initx = mask._x;//首先定位一个初始点,这是页面定位的常量
var inity = mask._y;//同上
var targetx=initx;
var targety=inity;//这两个变量也用于定位,使用韩式缓冲公式算法,可以让MC缓慢地移动到(targetx,targety)这一点。
this.onEnterFrame = function() {
       pages._x = pages._x-0.2*(pages._x-pages.targetx);
       pages._y = pages._y-0.2*(pages._y-pages.targety);
};//这个则是缓冲公式
function loadNews(href) {//定义按钮触发的函数
       pages.targetx = initx-pages[href]._x;
       pages.targety = inity-pages[href]._y;//先让target定位至当前MC(也就是传入的参数href),然后缓冲公式会让当前传入的MC显示出来,其它的则隐藏
       fscommand("setAddress", href);//设定地址栏内容,用于刷新页面时的定位,在JS里会响应这一命令。
       getURL("statistics.html?"+href, "stat");//打开iframe,让iframe记录当前点到的MC的实例名href
}

2.1 以带有fscommand跟踪的Flash发布一个HTML文件和一个SWF文件,接着把发布设置中格式选项卡的HTML勾去掉。

2.2 用记事本打开index_flash.html文件,找到//place your code here 一句。写入

if(command=="setAddress"){
          document.location.hash=args
        }

2.3 然后定义一个onLoad执行的函数JS_LoadNews

  function JS_LoadNews(){
  window.open("statistics.html?"+document.location.hash.slice(1),"stat")//让名为stat的iframe打开一个带参数的地址
}

2.4 根据上一步的JS,加一个iframe

<iframe noscroll border="0" src="about:blank" width="1" height="1" name="stat" id="stat"></iframe>

2.5 在body标签里加onload=JS_LoadNews()

3.1 新建一个HTML文件,名为statistics.html,在这里写入控制Flash的代码:

<script language="javascript">
  function pageLoad(){
    window.parent.index_flash.setVariable("link",window.document.location.search.slice(1))//parent指父级框架,这里可以指向FLASH文件,location.search是获取地址参数,该值包含“?”,所以用slice(1)去掉。
  }
</script>
<body onload=pageLoad()>
</body>

3.2 上面的代码设置了Flash里的link值,为了触发Flash的函数,在Flash里用addProperty来触发相关函数:
  追加帧代码:

  this.addProperty("link", getLink, setLink);
function getLink() {
}
function setLink(link) {
       fscommand("setAddress", link);
       pages.targetx = initx-pages[link]._x;
       pages.targety = inity-pages[link]._y;
}

时间: 2024-08-30 22:10:45

让Flash网站具有IE前进后退功能的相关文章

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

前言: 写完流量统计的教程以后,本以为会很轻松地就可以完成该篇文章.后来才发现,原来还是遇到了困难.因为要通过iframe控制主HTML的变量,一开始,考虑到打开父窗口用的是_parent,而Flash里的父级也是_parent,于是理所当然地以为iframe访问主html也是通过_parent,结果,弄了很久,还是提示_parent未定义.为此,我百度了下,看如何通过iframe访问主html.晕,原来这个是没有下划线的,于是改了下,发现有新的问题,就是提示"没有权限"的错误.在之前

Flash 网站的流量统计

流量|统计 Flash全站的技术应用系列:(一)AS+JS的Flash网站无刷新定位技术  (二)Flash网站的SEO(搜索引擎优化)(三)Flash网站的流量统计 (本文)(四)让Flash网站具有IE前进后退的功能 前言 前段时间发了两篇Flash全站的技术应用文章后,有部分网友提出说,叫我写篇文章,阐述如何实现IE的前进后退功能.但是这个并没有在我的计划之中,也没有研究过.找了一堆关于堆栈历史记录的东西,很多都用了AJAX,看着头晕,并且拷贝人家的代码来运行也实现不了.接着,还拿了2AD

Flash网站的流量统计

前段时间发了两篇Flash全站的技术应用文章后,有部分网友提出说,叫我写篇文章,阐述如何实现IE的前进后退功能.但是这个并没有在我的计划之中,也没有研究过.找了一堆关于堆栈历史记录的东西,很多都用了AJAX,看着头晕,并且拷贝人家的代码来运行也实现不了.接着,还拿了2AD的JS来研究,总没发现跟历史记录有关的东西,而且历史记录也没保存到我的机器里.就算了,先把这文章写出来.但是我在测试这个统计的时候,发现我的IE也能前进,后退,只是FLASH没有作出响应而已. 后来,经过Digi的提点以后,竟然

2010年最佳Flash网站赏析

面向全球电子商务知识库网站eBizMBA公布了本年度的十佳Flash网站,这些网站都是经过eBizMBA的网站编辑根据视觉艺术.声效.易用性和创新性等多方面考究评选出来的. 1 Moodstream Getty Images Moodstream是一个实验型的网站,它不仅是一个大型的图库,而且将视频.图像和音乐创造性地融合到了同一个平台上,用户还可以自助调整黑白或彩色.歌词或乐器.快乐或悲伤等等,是一个当之无愧的互动艺术作品.这是一个同时欣赏图片.影像和音乐的好地方. 2 Monoface "M

全Flash网站制作剖析

经过一段时间的Flash学习之后,很多朋友开始对那些全Flash网站的制作发生兴趣.全Flash网站基本以图形和动画为主,所以比较适合做那些文字内容不太多,以平面.动画效果为主的应用.如:企业品牌推广.特定网上广告.网络游戏.个性网站等. 制作全Flash网站和制作html网站类似,事先应先在纸上画出结构关系图,包括:网站的主题.要用什么样的元素.哪些元素需要重复使用.元素之间的联系.元素如何运动.用什么风格的音乐.整个网站可以分成几个逻辑块.各个逻辑块间的联系如何.以及你是否打算用Flash建

Flash深入学习:全Flash网站制作剖析

(另外推荐学习:flash制作很出效果的韩国菜单 flash制作广告全程实例)     经过一段时间的Flash学习之后,很多朋友开始对那些全Flash网站的制作发生兴趣.全Flash网站基本以图形和动画为主,所以比较适合做那些文字内容不太多,以平面.动画效果为主的应用.如:企业品牌推广.特定网上广告.网络游戏.个性网站等. 制作全Flash网站和制作html网站类似,事先应先在纸上画出结构关系图,包括:网站的主题.要用什么样的元素.哪些元素需要重复使用.元素之间的联系.元素如何运动.用什么风格

小议制作Flash网站及flash应用的技巧

技巧 flash网站技巧拾零 1. 快速更新网站文字 在Flash网站各子界面制作过程中,网站文字可以通过复制.粘贴.甚至直接导入文本的方式进行.这里介绍的方法是连A4Desk都不用打开,直接修改文本文件即可更新网站文字了.因为在制作Flash网站时,在软件安装目录下会自动生成一个import文件夹,该文件夹里的每一个文本文件的内容都和网站页面的内容相对应的,找到相应的文本文件即可进行修改了. 2. 快速修改菜单标签 在制作在Flash网站时,修改菜单标签是通过执行"Edit→Section N

全Flash网站制作剖析-1

经过一段时间的Flash学习之后,很多朋友开始对那些全Flash网站的制作发生兴趣.全Flash网站基本以图形和动画为主,所以比较适合做那些文字内容不太多,以平面.动画效果为主的应用.如:企业品牌推广.特定网上广告.网络游戏.个性网站等. 制作全Flash网站和制作html网站类似,事先应先在纸上画出结构关系图,包括:网站的主题.要用什么样的元素.哪些元素需要重复使用.元素之间的联系.元素如何运动.用什么风格的音乐.整个网站可以分成几个逻辑块.各个逻辑块间的联系如何.以及你是否打算用Flash建

25个有灵感的3D界面的FLASH网站设计实例

这是非常惊人的冷静冲浪周围三维闪光灯网站. 与震撼的视觉体验和难以置信的使用者之间的相互作用,尽管闪存肯定不是最喜欢的媒介无障碍,但它使网络与功能,闪光使设计者和开发者提供丰富的内容的浏览器,创造运动,互动性以及令人印象深刻的视觉经验, 这里是收集最闪光的网站, 3D环境和3D界面,请务必将您的一位发言者,因为大多数这些Flash网站使用的是冷静的音频以及.(这些网站将需要多一点带宽,请耐心等待,而该网站负载,这些网站是值得的等待时间) 1.) Comcast Town 2.) Markez M