[AS3]AS3与ExternalInterface实现的特殊效果
[AS3]AS3与ExternalInterface实现的特殊效果
构想
flash尽量小? 采用背景图片与flash分离方式
可编辑?外部传值
flash透明 背景还要有onmouseover 效果? 用AS3调用JS 操作DOM
原理
利用 AS3 ExternalInterface 接口与 JS通信
用坐标轴 计算得出 onmouseover 元素
初始化参数如下:
- var op={
- width:1024, //flash 宽度
- height:530, //flash 高度
- target:'new', //tatget 不解释你懂的
- delay:0.5, //动画延迟 时间单位 秒
- autoMove:false, //是否自动运行动画
- img:[[imgurl,href,x,y]] //展示图片数组
- }
与此同时 JS端 并行加载 背景图片中,代码如下:
- var BgImg = new Image();
- BgImg.onload = function()
- {
- /*
- 生成色块、设置动画
- */
- setTimeout(function()
- {
- flash=document["flashUpImg"]||window["flashUpImg"];
- if( FlashReady) //验证flash 是否加载完成 (如何验证?)
- {
- if(flash.jsMove())return; // 初始化设置了autoMove:false 所以这里手动调用
- }
- setTimeout(arguments.callee,10);
- },10);
- }
此效果主要AS3 程序:
- stage.addEventListener(MouseEvent.MOUSE_MOVE,MouseMove);
- public function MouseMove(event:Event):void {
- ExternalInterface.call("Flash_MouseMove",stage.mouseX,stage.mouseX);//flash调用js中的方法
- }
主要JS函数:
- function Flash_MouseMove(x,y) //CuPlayer.com鼠标移动函数
- {
- var d = Math.floor(x/barWidth);
- if(d==nowDiv)return;
- $animate( pc[nowDiv], { 'marginTop':{from:'3px', to:0}, 'opacity':{from:1,to:0.8} }, 150);
- $animate( pc[d], { 'marginTop':{from:0, to:'3px'}, 'opacity':{from:0.8,to:1} }, 150);
- nowDiv = d;
- }
热门文章推荐
- [HLS]做自己的m3u8点播系统使用HTTP Live Streaming(HLS技术)
- [FMS]FMS流媒体服务器配置与使用相关的介绍
- [AS3]什么是M3U8,与HTML5的区别是什么
- AS2.0 让flash自适应全屏,并且不自动缩放
- [AS3]as3.0的sound类常用技巧整理
- [AS3]as3与ByteArray详解、ByteArray介绍、ByteArray用法
- 关于RTMP,RTMPT,RTMPS,RTMPE,RTMPTE协议的介绍
- [JS]分享浏览器弹出窗口不被拦截JS示例
请稍候...