我用prototype.js库玩了一个steriotab系统,一切正常,除了steriotabs容器下的下一个DIV在转到下一个选项卡时显示得像一个闪光..我知道它有点难以理解..在这里你可以在他们的网站上看到它http://stereointeractive.com/blog/code/prototype-tabs/
您可以通过连续更改四个选项卡(功能、设置、配置、下载)三四次来看到这一点。评论部分将在导航选项卡(功能、设置、配置、下载)下方快速显示。
我认为问题在于当它进入下一个选项卡时,当前选项卡是 display:none 并且在此期间当然没有任何内容(1 或 2 秒),因此下一个 html 代码块将出现在导航下方的顶部。
这个javascript可能会导致问题..
activate: function(tab) {
var tabName = tab.id.replace(this.options.ids.tab,'');
this.currentPanel = this.options.ids.panel+tabName;
if (this.showPanel == this.currentPanel) {
return false;
}
if (this.showPanel) {
if (this.options.effects) {
new Effect.Fade(this.showPanel, {queue: 'front'});
} else {
$(this.currentPanel).hide();
}
}
if (this.options.effects) {
new Effect.Appear(this.currentPanel, {queue: 'end'});
} else {
$(this.showPanel).show();
}
this.tabs.invoke('removeClassName', this.options.classNames.tabActive);
tab.addClassName(this.options.classNames.tabActive);
this.showPanel = this.currentPanel;
}
你们有什么想法吗?