0

私はいくつかのスパンタグを持っています：

<span data-w="560"></span>
<span data-w="340"></span>
<span data-w="120"></span>

data-w属性で事前設定されたターゲット幅に到達するように各スパンをアニメーション化するjQueryコードがあります。

$(document).ready(function(){

    $('span').each(function() {

        $(this).animate({width: $(this).attr('data-w') + 'px'}, 1000);

    });

});

ここではすべてが正常に機能します。

ここで、すべてのスパンを一緒にアニメーション化するのではなく、各スパンを単独でアニメーション化するようにします。

どうやってするの？queue（）を使用している可能性がありますか？どうやって？

ありがとう。

4

1 に答える 1

1

独自のキューを作成できるかもしれません:

var spanW_loop = 0;
var spanW_size = jQuery('#spanW span[data-w]').length;

    function animateSpanW() {
    var spanWidth = jQuery('#spanW').children('span[data-w]').eq(spanW_loop).attr('data-w');
        jQuery('#spanW').children('span[data-w]').eq(spanW_loop).animate({width: spanWidth + 'px'}, 1000, function() {
            spanW_loop += 1;
            if(spanW_loop < spanW_size) {
                animateSpanW();
            }
        });
    }

animateSpanW();

</p>

于 2012-11-07T23:51:29.867 に答える