CSS在呈现页面后生效

Question

我遇到了我的页面加载的问题,然后在几分之一秒后发生CSS效果或样式.

我看到的主要问题是我正在使用的JQuery选项卡 http://docs.jquery.com/UI/Tabs#source

当页面呈现时,标签会在另一个下方显示一个,如下所示:

One 
Two
Three

然后作为标签正确呈现

有没有一种快速简便的方法来解决这个问题.谢谢

Answer 1

这不是造型; 它是jQuery UI javascript库,它将必要的html附加到您的页面,以便选项卡看起来非常漂亮.

你有几个选择.首先,您可以隐藏选项卡并在jQuery UI完成其魔术后显示它们.其次,您可以设置选项卡的样式,使它们看起来足够接近完成的输出,以便更改不那么明显.第三,您可以删除jQuery UI并仅使用CSS设置选项卡样式.我会说所有有效的方法.

希望这可以帮助!

编辑:

对于第一个选项,让我们说这是包含选项卡的div:

<div id="tabs">
  ...stuff...
</div>

在样式表中,隐藏#tabs:

#tabs {
    display:none;
}

然后,修改您的jQuery UI调用,如下所示:

var t = $("#tabs");

t.tabs({
    create:function(){
        t.show();
    }
});