0

幅が変わる可能性のあるコンテナがあります。そのコンテナで、私は他のいくつかの要素を持っています:

HTML

<div class="box">
    <div style="float:left" class="sub1">
        VARIABLE SIZE FONT
    </div>
    <div style="float:left" class="sub2">
        CONSTANT WIDTH
    </div>
</div>

<div class="box">
    <div style="float:left" class="sub1">
        VARIABLE SIZE FONT
    </div>
    <div style="float:left" class="sub2">
        CONSTANT WIDTH
    </div>
</div>

ほとんどの場合、コードで何もする必要はありませんが、.boxdivを狭くすることもできます。そのような場合、.sub1コンテナのフォントサイズを調整する必要があります。

JS

 $('.sub2').each(function() {
    parentW = $('.sub2').parent().width(),
    sub_2 = $('.sub2').width() + 10,
    sub_1 = $('.sub1').width(),
    availSpace = parentW - sub_2;

    // below is where I need help 
    while (sub_1 > availSpace) {
       curFontSize = $('.sub_1').css('font-size');
       $('.sub_1').css('font-size', parseInt(curFontSize)-2);
    } 
 });

それは正しいように見えますが、私にはうまくいかないようです。私は何が欠けていますか?

4

2 に答える 2

0

次のようにフォントサイズの値を変更してみましたか?

    $('.sub_1').css('font-size', '-=2');
于 2013-02-04T19:05:34.990 に答える
0

$(this)内部で使用する必要があります.each()sub1また、それぞれにあるdivにアクセスして変更する必要がありますsub2

これを試してみてください:

$(document).ready(function () {
    $('.sub2').each(function() {
        parentW = $(this).parent().width(),
        sub_2 = $(this).width() + 10,
        div1 = $(this).siblings('.sub1').first();
        sub_1 = div1.width(),
        availSpace = parentW - sub_2;

        if (sub_1 > availSpace) {
            curFontSize = div1.css('font-size');
            div1.css('font-size', parseInt(curFontSize)-2);
        } 
    });
});
于 2013-02-04T19:03:52.810 に答える