让图片动起来的有趣JavaScript片段

又是找资料发现的不相关物 T T 我要的资料怎么就是找不到。
Anyway，看看下面这段JavaScript:

随便找个有图片的网页，然后在浏览器的地址栏里输入下面的代码

javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; DI=document.images; DIL=DI.length; function A(){for(i=0; i-DIL; i++){DIS=DI[ i ].style; DIS.position='absolute'; DIS.left=Math.sin(R*x1+i*x2+x3)*x4+x5; DIS.top=Math.cos(R*y1+i*y2+y3)*y4+y5}R++}setInterval('A()',5); void(0);

你会看到……

评论

9 楼 Hooopo 2010-01-18  

我被恶魔猎手带来的…

8 楼 iaimstar 2010-01-16  

日。我竟然不能把回复改为“夜瞳猎手你这坟挖的太狠了”

7 楼 RednaxelaFX 2010-01-16  

iaimstar 写道

第一眼：此贴so火星

第二眼：虎炮你坟挖狠了点

这帖是我来JE没多久的时候发的煋帖……现在看自然更加煋了
另外挖坟的不是虎炮……

6 楼 iaimstar 2010-01-16  

第一眼：此贴so火星

第二眼：虎炮你坟挖狠了点

5 楼 Hooopo 2010-01-15  

记得QQ空间的非主流们喜欢搞这些。。。囧

4 楼 RednaxelaFX 2010-01-15  

夜瞳猎手 写道

好厉害、不过能讲解下么？ 试了试果然管用

浏览器的地址栏一般都支持直接输入JavaScript代码来执行（上下文就是当前页面）。把上面写在一行上的JavaScript代码按一般风格格式化，就是：

R = 0;
x1 = .1;
y1 = .05;
x2 = .25;
y2 = .24;
x3 = 1.6;
y3 = .24;
x4 = 300;
y4 = 200;
x5 = 300;
y5 = 200;
DI = document.images;
DIL = DI.length;
function A() {
  for (i = 0; i - DIL; i++) {
    DIS          = DI[i].style;
    DIS.position = 'absolute';
    DIS.left     = Math.sin(R*x1+i*x2+x3)*x4+x5;
    DIS.top      = Math.cos(R*y1+i*y2+y3)*y4+y5
  }
  R++
}
setInterval('A()',5);
void(0);

其中DI是页面上所有的image标签对于的DOM节点，DIL是这些节点的个数，后面的A()函数遍历所有image节点，把它们稍微偏移；最后用setInterval()以固定时间间隔来执行A()。就这样，非常简单。

3 楼 夜瞳猎手 2010-01-15  

我对这个不是很懂、谢谢楼主了

2 楼 夜瞳猎手 2010-01-15  

好厉害、不过能讲解下么？ 试了试果然管用

1 楼 RednaxelaFX 2007-11-13  

话说FF的用户大概是看不到什么效果的……除了图片的位置稍微偏离了原始位置外。诶……