首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

mac chrome 标签成效实现

2012-11-22 
mac chrome 标签效果实现google 发布了 mac 版的chrome,据说增加了几万行 mac 下特有的平台代码,性能没啥

mac chrome 标签效果实现

google 发布了 mac 版的chrome,据说增加了几万行 mac 下特有的平台代码,性能没啥察觉,倒是 mac chrome 的标签效果挺有趣,在关闭和打开新标签时,按照google的说法,顺应mac平台增加了一些滑动效果。



在 tabPanelLite 实现一下呵 :


演示 @ google code


注意事项:


1. 关键要熟悉 extjs 的动画机制,详见 Ext.Fx分析? ,? Ext.lib.anim分析


2. 注意 动画wrap的生成,不能完全依赖extjs ,要自己订制wrap了。

?

?

/*建立tab包装层,用来定位改变大小并移动,关键overflow:hidden,tab在其中绝对定位*/var wrap= lis.item(index).wrap({style:{position:"relative",float:"left",overflow:"hidden"}});/*开始动画*/lis.item(index).slideOut('bl', { duration: .35 ,wrap:wrap,callback:function(el){el.remove();wrap.remove();var panels = me.panelContainer.select("> div.panel");panels.item(index).remove();}});

热点排行