Question

我正在尝试使用名为[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);

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>

负载大小不合适

0 个答案: