Jquery 装载时尺寸不当

我正在尝试使用一个名为[SlabText][1]的插件。它很棒，可以跨多个浏览器工作，但是，我遇到了一个大小合适的问题。当文本最初加载时，它没有利用分配给它的空间。如果我刷新或重新调整页面大小，它会突然正常缩放

首先，我认为这是由于其他插件大约在同一时间启动，所以我为这一个添加了延迟，但我仍然有相同的问题。似乎我试过各种方法，只是不确定原因是什么

不确定这是否有任何价值，大部分重新调整大小都是通过插件完成的，但下面是我如何将其组合在一起的

$(".banner").unslider({
        speed: 1500,              //  The speed to animate each slide (in milliseconds)
        delay: 25000,             //  The delay between slide animations (in milliseconds)
        complete: function() {},  //  A function that gets called after every slide animation
        keys: true,               //  Enable keyboard (left, right) arrow shortcut
        dots: true,               //  Display dot navigation
        fluid: false              //  Support responsive design. May break non-responsive designs
    });


    var stS = "<span class=\'slabtext\'>",
        stE = "</span>"
        prc = "<div class=\"mar20top alnRt\"><a class=\"btn\" href=\"/pricing\"><span class=\"uico ui-icon-tag icoSpan\"></span>Pricing</a> &nbsp; ",

        txt_CS = [
            "improve information architecture (IA) with",
            "CARD SORTING",
            "Try our online (remote) tool",
            "get instant results with built-in data analytics",
            "unlimited tests & participants / open, closed or hybrid test / images, text or mixed Cards"
        ],
        lnk = prc + "<a class=\"btn\" href=\"/features/Card_Sorting\"><span class=\"uico ui-icon-star icoSpan\"></span>Features</a> &nbsp; <a class=\"btn\" href=\"/CardSorting\"><span class=\"uico ui-icon-newwin icoSpan\"></span>Learn more about Card Sorting</a></div>";

    $("#CardSort_HDR").html(stS + txt_CS.join(stE + stS) + stE).slabText();
    $("#CardSort_HDR span:nth-child(2)").css({"color":"#b9cde5", "line-height":"0.8"});
    $("#CardSort_HDR span:nth-child(3), #CardSort_HDR span:nth-child(5)").css({"color":"#999", "line-height":"0.8"});
    $("#promo li:nth-child(1)").append(lnk).hide().delay(1000).fadeIn(2200);

$（“.banner”）.unslider({
速度：1500，//为每张幻灯片设置动画的速度（毫秒）
延迟：25000，//幻灯片动画之间的延迟（毫秒）
complete:function（）{}，//在每次幻灯片动画之后调用的函数
按键：true，//启用键盘（左、右）箭头快捷键
dots:true，//显示点导航
流体：错误//支持响应性设计。可能会破坏非响应性设计
});
var stS=“”，
stE=“”
prc=“”，
txt_CS=[
“利用”，
“卡片分类”，
“试试我们的在线（远程）工具”，
“通过内置数据分析获得即时结果”，
“无限测试和参与者/开放、封闭或混合测试/图像、文本或混合卡”
],
lnk=prc+“”；
$（“#CardSort_HDR”）.html（stS+txt_CS.join（stE+stS）+stE.slabText（）；
$（“#CardSort_HDR span:nth child（2）”）.css（{“color”：“#b9cde5”，“line height”：“0.8”}）；
$（“#CardSort_HDR span:n个孩子（3），#CardSort_HDR span:n个孩子（5）”）.css（{“颜色”：“#999”，“线条高度”：“0.8”}）；
$（“#promo li:nth child（1）”）.append（lnk.hide（）.delay（1000）.fadeIn（2200）；

HTML

您最近是否更改了某些内容？在Firefox22.0中，它似乎工作得很好。在Chrome 28.0.1500.72中，在我调整窗口大小之前，它从不填充空间（无论刷新如何）；IE10也一样。你能提供一段代码来执行具体化吗？我在计算高度时遇到了类似的问题，只有Chrome和Opera 15无法正确计算高度，除非调整窗口大小，因为它们返回的高度无效（对我来说，它们包括一个工具栏的高度）。您不必在双引号内转义单引号：

var stS=“”，

为什么要用脚本构建标记？将HTML放在它所属的位置，并根据需要对其进行操作。

<div id="contArea" class="banner">
<ul id="promo">
    <li class="h1" id="CardSort_HDR"></li>
    <li class="h1" id="PrMatrix_HDR"></li>
    <li class="h1" id="heurEval_HDR"></li>
</ul>
</div>