0

ここに新しい質問を投稿したところ、画面解像度が 980px 未満の場合に画像の幅と高さを削除する方法についての回答が得られました。

私はこのコードを得ました:

<img width="477" height="299" src="/uploads/2012/01/415.jpg" class="attachment-portfolio2 wp-post-image"/> 

var images;

$(function() {  
    images = $('img.wp-post-image');
    removeSize();
});

$(window).resize(removeResize);

function removeSize()
{
    if($(window).width() < 980 && images.length > 0)
    {
        images.removeAttr('width').removeAttr('height');
    }
}

今、私はそれを "change width jquery comand" に変更したいので、試してみました:

 var images;

    $(function() {  
        images = $('img.wp-post-image');
        removeSize();
    });

    $(window).resize(removeResize);

    function removeSize()
    {
      if ( $(window).width() < 960) {
    $('img.wp-post-image').animate({width:'400px'});
    $('img.wp-post-image').animate({height:'300px'});
}
else {
    $('img.wp-post-image').animate({width:'400px'});
    $('img.wp-post-image').animate({height:'300px'});
}
    }

しかし、機能していません。何が問題なのですか? ありがとうございました

4

1 に答える 1

1

それを通常の関数に単純化すると、次のようになります。

$(function () {
    var images = $('img.wp-post-image');
    $(window).on('resize', function() {
        if ($(window).width() < 960) {
            $('img.wp-post-image').animate({ width: '400px' });
            $('img.wp-post-image').animate({ height: '300px' });
        } else {
            $('img.wp-post-image').animate({ width: '400px' });
            $('img.wp-post-image').animate({ height: '300px' });
        }
    });
});

if / else が何があっても同じことを行い、同じ要素を同時に2回アニメートしているため、ミュートに見えるという事実を除けば、それはうまく機能しますか? アニメーションを連鎖させようとしていますか?もしそうなら、コールバック機能を使用してください:

$('img.wp-post-image').animate({ width: '400px' }, 500, function() {
      $(this).animate({ height: '300px' }, 500);
});
于 2013-03-04T04:54:40.837 に答える