浏览 4782 次
|
精华帖 (0) :: 良好帖 (1) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-10-07
最后修改：2009-08-18
之前用 SmoothGallery 和 LightWindow，虽然都不错，但是毕竟一个是mootools的东西，一个是prototype的东西，用起来难免不方便，所以动手用mootools重新实现了一下，风格和特效还是沿用它们的
演示demo地址：http://www.onshowing.net/demo(2009年9月后无效) 对js相册感兴趣的朋友可以看看 对 SmoothGallery 主要做了以下改进： 1. 对浏览器的前进、后退支持，不再依靠hash实现，所以在保留前进、后退的功能时，地址栏是干净的 2. 改进了渲染方式，多图间的切换不再重复渲染多余的层 3. 没有了 SmoothGallery 中的内存泄露问题 对 SmoothGallery 去除了以下功能： 1. 不支持通过html代码创建数据生成相册，而使用既定数组或者通过 ajax 调用返回数据生成相册。其实这更接近实际应用 2. 去除了“相册组”的应用，个人感觉多余 对于 LightWindow，我只沿用了其界面显示效果，及其窗口变换效果，其他的加载 flash，iframe功能通通去掉了 相册的使用方法如下：
<div id="gallery"></div>
window.addEvent('domready', function(){
myGallery = new onshowing.gallery('gallery', {
width: 620,
height: 507,
dataUrl: '/demo/data.html'
});
});
下面贴出部分支持浏览器前进后退功能的源码：
onshowing.historyManager = new Class({
Implements: [Events, Options],
initialize: function(options){
this.setOptions({
/*onStateChanged: $empty,*/
observeDelay: 100
}, options);
this.currentState = 'nothing';
this.frame = new Element('iframe', { width: 0, height: 0, id: 'historyFrame', styles: { display: 'none'}}).inject(document.body);
this.checkTimer = this.checkState.periodical(this.options.observeDelay, this);
},
add: function(title, state){
if(this.currentState == state) return;
this.currentState = state;
try {
var doc = this.frame.contentWindow.document;
doc.open();
doc.write('<html><head><title>' + title + '</title></head><body>' + state + '</body></html>');
doc.close();
} catch(e) {};
},
checkState: function(){
var state = this.frame.contentWindow.document.body.innerHTML;
if(state != this.currentState){
this.currentState = state;
this.fireEvent('stateChanged', state);
}
},
dispose: function(){
$clear(this.checkTimer);
this.removeEvents();
this.frame.dispose();
delete this.frame;
}
});
声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2008-10-07
nice work~~
|
| 返回顶楼 | |
|
发表时间：2008-10-07
谢谢楼上的鼓励
|
| 返回顶楼 | |
|
发表时间：2008-10-25
很不错，谢谢你的分享！
|
| 返回顶楼 | |
|
发表时间：2008-11-04
赞一下，做的很不错。
1. 不支持通过html代码创建数据生成相册，而使用既定数组或者通过 ajax 调用返回数据生成相册。其实这更接近实际应用 这点不同意，通过html代码创建数据生成相册，对不懂javascript的人来说更友好。 |
| 返回顶楼 | |
|
发表时间：2008-11-04
"1. 对浏览器的前进、后退支持，不再依靠hash实现，所以在保留前进、后退的功能时，地址栏是干净的 "
这点我认为并不是个好的解决方式，因为一个好的相册必须提供分享给好友的机制，如果地址栏不变，也就是说无法将特定的图片分享给好友了。 "2. 去除了“相册组”的应用，个人感觉多余 " 这点我也持相反意见，相册有目录划分我认为还是有必要的。 |
| 返回顶楼 | |
|
发表时间：2008-11-09
forfun 写道 "1. 对浏览器的前进、后退支持，不再依靠hash实现，所以在保留前进、后退的功能时，地址栏是干净的 "
这点我认为并不是个好的解决方式，因为一个好的相册必须提供分享给好友的机制，如果地址栏不变，也就是说无法将特定的图片分享给好友了。 "2. 去除了“相册组”的应用，个人感觉多余 " 这点我也持相反意见，相册有目录划分我认为还是有必要的。 呵呵，我坦白，“相册组”并不多余，只是我当时写累了，所以觉得多余。。。 |
| 返回顶楼 | |
