jquery - jquery. アニメーションで div 幅を変更しても機能しない

Question

皆さん、こんにちは、変数 (widthPercent) があり、たとえばパーセントを格納します: 67.33%

jqueryアニメーションで幅を変更しようとしてもうまくいきません:

$(this).animate({
        width: widthPercent,
    }, 2500);
});

しかし、cssで幅を変更するとうまくいきます：

$(this).css('width', widthPercent);

誰かが私の問題が何であるか知っていますか?

Answer 1

たぶんあなたはwidthPercentを引用する必要があります

これは私のために働いた

$(document).ready(
                function(){
                    var widthPercent = "35%";
                    $("#btn").click(
                    function(){

                        $(this).animate({
                            width: widthPercent,
                        }, 2500);
                    });
                }
            );

問題はwidthPercentの定義にあるはずです。

Answer 2

http://api.jquery.com/animate/

var widthPercent = "35%";

$(this).animate({
        width: "'"+widthPercent+"'"   // YOU ALSO HAD AN EXTRA COMMA HERE MEANING IT WAS EXPECTING ANOTHER ARGUMENT -- extra quotes may or may not be necessary depending on what your actual variable looks like
    }, 2500);
});

http://jsfiddle.net/A2bdQ/5/

また、％記号を使用する場合は、必ず引用符を使用してください。引用符を使用しないと、インラインmod操作として扱われる可能性があります。

Answer 3

これはあなたが意味することですか：

jQuery：

$('#foo').click(function(){
    var widthPercent = '66%';
    $(this).animate({
        'width': widthPercent,
    }, 2500);
});

CSS：

#foo{
   width:300px;
   background:#ff0000;
   height:100px;   
}

JSFiddle。

Answer 4

次のように、幅の値に「%」文字を追加する必要があります。

$(this).css('width', widthPercent + '%')

これを説明するjsfiddleを次に示します。