+ -
当前位置:首页 → 问答吧 → adidas网站动画效果如何做?

adidas网站动画效果如何做?

时间:2008-11-10

来源:互联网

http://www.adidas.com/cn/homepage.asp
这个动画采用的是什么技术?想研究一下,动画下载下来却不是网上看到的那样

[ 本帖最后由 网上飘 于 2008-11-10 14:25 编辑 ]

作者: 网上飘   发布时间: 2008-11-10

和这个有点类似
http://www.hubltd.com/
只不过adi的那个对象,onRollOver的时候会展开,宽度高度会发生变化而已~

至于你说的技术是指flash所用到一些主要方法吗?
xml+pic,tween类(自定义的缓冲),Point类等

我上面提供的那个网址,以前也是论坛里有人询问的效果~因为我之前模仿过,如果有需要的话,我可以提供源文件 ,不过要晚上去了,源文件在家里

因为之前有网友在论坛里提出http://www.hubltd.com/这个图片效果的原理,所以我在博客里做了一个模仿的效果,因为只是简单的模仿,代码效率也懒得去优化了,所以也没有在论坛里贴出来,只是简单在博客里写了点
首先要说明的是,原网站的特效是swf+xml的,我这不是,因为我比较懒!:)
如果有需要的话,可以自己修改,原理都是一样的
复制内容到剪贴板
代码:
import flash.geom.Point;
var dx:Number = 10;
var dy:Number = 10;
var mc_num:Number = 8;//场景中放8个命名为mc1...mc8的影片剪辑,这里你改为xml的时候,就根据图片的数目来定义了
for (var i:Number = 1; i<=mc_num; i++) {
var tempMC:MovieClip = this["mc"+i];
tempMC.orgX = tempMC._x;
tempMC.orgY = tempMC._y;
tempMC.go = false;
tempMC.onRollOver = function() {
   mymove(this);
};
tempMC.onRollOut = function() {
   delete this.onMouseMove;
   huifu(this);
};
tempMC.onEnterFrame = function (){
   if(this.go){
     this._x += (this.orgX-this._x)/10;
     this._y += (this.orgY-this._y)/10;
     if(Math.abs(this._x-this.orgX)<0.5){                  
      this.go =false;
    }
   }
}
}
function huifu(obj) {
for (var a:Number = 1; a<=mc_num; a++) {
   var tempmc = this["mc"+a];
   if (tempmc != this) {
    tempmc.go = true;
   }
}
}
function mymove(obj) {
obj.onMouseMove = function() {
   for (var k:Number = 1; k<=mc_num; k++) {
    var otherMC:MovieClip = this._parent["mc"+k];
    otherMC.id = k;
    if (otherMC != this) {
     var myWidth:Number = this._width/2;
     var myHeight:Number = this._height/2;
     var mypoint:Point = new Point(this._x, this._y);
     var mousepoint:Point = new Point(_xmouse, _ymouse);
     var distanceBetween:Number = Point.distance(mypoint, mousepoint);
     if (otherMC._x<=this._x) {
      otherMC.X = -1;
     } else {
      otherMC.X = 1;
     }
     if (otherMC._y<=this._y) {
      otherMC.Y = -1;
     } else {
      otherMC.Y = 1;
     }
     var p1 = {x:_xmouse, y:_ymouse};
     var p2 = {x:this._x, y:this._y};
     var myrotation = angle(p1, p2);
     var yiX:Number = Math.abs(distanceBetween*Math.cos(myrotation));
     var yiY:Number = Math.abs(distanceBetween*Math.sin(myrotation));
     var disx:Number = Math.abs((myWidth-yiX)*dx/myWidth);
     var disy:Number = Math.abs((myHeight-yiY)*dy/myHeight);
     otherMC._x = otherMC.orgX+otherMC.X*disx;
     otherMC._y = otherMC.orgY+otherMC.Y*disy;
    }
   }
};
}
function angle(p1, p2) {
var disx = p1.x-p2.x;
var disy = p1.y-p2.y;
var ro = Math.atan2(disy, disx);
return ro;
}

作者: libins   发布时间: 2008-11-10

谢谢libins,我研究一下

作者: 网上飘   发布时间: 2008-11-10

我把http://www.adidas.com/cn/homepage.asp这个页面的文件按目录重组了一下,却无法正常浏览动画里面内容,能帮我看看是怎么回事吗?
flash站.rar

作者: 网上飘   发布时间: 2008-11-10

跪求源文件,刚刚给斑竹发了求助短信息

作者: mzdxopt   发布时间: 2010-11-23