0

我在这里发布了一个新问题，我得到了当我的屏幕分辨率低于 980 像素时如何删除图像宽度和高度的答案。

我得到了这个代码：

<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');
    }
}

现在，我想将其更改为“更改宽度 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 似乎静音的事实，因为无论如何它都会做同样的事情，并且您同时为相同的元素设置两次动画？您是否尝试链接动画，如果是，请使用回调功能：

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