如果你去看我正在制作的幻灯片 here ，您可以看到，如果您调整浏览器窗口的大小，图像会正确调整大小和移动。
...除非您使浏览器窗口的宽度小于一定量(我不知道是什么定义了该量)，然后它会拉伸(stretch)图像而不是缩放图像。我该如何解决这个问题？
这是我的调整大小代码:
winWidth = $(window).width();
winHeight = $(window).height();
ratio = winWidth/winHeight;
if(ratio > imgRatio){
$('#curImg img').css({width:winWidth});
imgWidth = winWidth;
imgHeight = $('#curImg img').height();
$("#curImg img").css({top: (-1*Math.round((imgHeight-winHeight)/2)) + "px"});
$("#curImg").css({height: winHeight + "px"});
}else{
$('#curImg img').css({height:winHeight});
imgHeight = winHeight;
imgWidth = $('#curImg img').width();
$("#curImg img").css({left: (-1*Math.round((imgWidth-winWidth)/2)) + "px"});
$("#curImg").css({width: winWidth + "px"});
}
最佳答案
您还可以查看这个 jQuery 插件: http://srobbin.com/jquery-plugins/backstretch/
或着眼于多种解决方案的 CSS 技巧: http://css-tricks.com/perfect-full-page-background-image/
关于javascript - "full-window"幻灯片图片拉伸(stretch)错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11208519/