作者TonyQ (骨头)
看板Ajax
标题Re: [问题] 怎麽修改让它从第一张开始播放？
时间Sat Jun 7 16:03:38 2008
※ 引述《eric8347 (杀人电风扇)》之铭言：
: http://preview.zcool.com.cn/code/js/04/1/
: 无意间看到的一个很漂亮的相簿
: 而且他竟然是用javascript+css写出来的
: 但是我发现他这个相簿照片都不会固定从那一张开始
: 会随机乱跳
: 稍微看了一下他的程式码
: 发觉好复杂喔＝ ＝...
: 不知道有没有人可以改写他的程式码
: 让它可以固定从第一张开始播放
其实没把js拆出来或compressed，要看source就还蛮简单的，
从进入点开始分析几乎都不会有问题。
大概分析一下这只程式的进入点
首先，他的相簿可以支援一个以上得Flow，
所以在init()里面可以看到
instances.push(
new ImageFlow(div, size, zoom, border)
);
然後再後面可以看到
setInterval(function () {
var i = instances.length;
while (i--) instances[i].run();
}, 16);
这是ImageFlow最早的进入点
接着trace一下 ImageFlow.run()
run : function (res) {
var i = this.NF;
while (i--) this.diapos[i].move(res);
}
diapos在ImageFlow Constructs可以找到蛛丝马迹
for (var i = 0, o; o = img[i]; i++) {
this.diapos[i] = new Diapo(this, i,
o.rel,
o.title || '- ' + i + ' -',
o.innerHTML || o.rel,
o.href || '',
o.target || '_self'
);
}
接着找到Diapo的move，他是放在 prototype 里面。
(prototype是所有该类别物件会共有的方法）
move里面说，如果这个物件已经被读取完成就进行移动，
否则就看他图片载入好了没（而且要有宽度），
如果ok 就进行Diapo的 init()并显示图片。
所以再回头看看这段 （NF是 img长度 ＝ diapos长度）
run : function (res) {
var i = this.NF;
while (i--) this.diapos[i].move(res);
}
你会看到每次开始位置都不太一样，不过是因为在进行这段code的时候，
图片的读取进度都不太一样的原因，他会显示最後一张在跑到这一段时，
已经完成的图片。
(ex.如果你用fx开，会每次都显示最後一张。）
────────────────────────────────
看到这里我想我已经给了很多提示，关於怎麽从第一张开始播放...
tip1.确定第一张已经读取完成
tip2.修改载入的顺序
剩下的是你自己要去努力的部份了
good luck
--
What you want to have ? / What you have?
从书本中，你可以发现我的各种兴趣。
从ＣＤ中，你可以了解我所喜欢的偶像明星。
或许从文字你很难以了解一个人，但从物品可以。
My Ppolis , My past. http://ppolis.tw/user/Tony1223
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 220.134.27.68
1F：推 eric8347:解释的真详细＠＠ 我再去试试！ 06/07 16:22