Jquery animate-图像在动画过程中被裁剪

我目前正在使用jquery库用javascript编程一个旋转木马。基本上，显示了三幅图像，中心图像比其他两幅图像大。在向左或向右移动时，中心图像的大小从115px*115px调整为50px*50px，并根据用户输入向左或向右移动

问题是，当调整大小时，中心图像会逐渐被裁剪，直到达到50px*50px，然后返回到更正常的状态：

Javascript如下所示：

$("div#carousel .item:eq(2)").animate({'width':'50px', 'height':'50px', 'opacity':'0.5'}, {queue:false, duration:900});  
$("div#carousel .item:eq(2) img").animate({'width':'50px', 'height':'50px', 'marginTop': '30px'}, {queue:false, duration:900});  
$("div#carousel .item:eq(1)").animate({'width':'115px', 'height':'115px', 'opacity':'1'}, {queue:false, duration:900});  
$("div#carousel .item:eq(1) img").animate({'width':'115px', 'height':'115px', 'marginTop': '0px'}, {queue:false, duration:900});  
$("div#carousel .item:not(eq(2))").animate({'left':'+=56px'}, {queue:false, duration:900});  
$("div#carousel .item:eq(2)").animate({'left':'+=122px'}, {queue:false, duration:900, complete: carousel.toggleInput});  

---

使用的图像是具有透明度的png

从这段代码来看，您的图像似乎在容器中

如果是这种情况，也许可以调整容器的大小，但不能调整图像本身的大小

如果容器溢出，这将导致裁剪：隐藏；在css中

---

但是为了确保我们需要在css中看到与此代码一起使用的css和基本html结构

set

img{width:100%}

。这将使用容器调整图像大小。