Question

我的html中有一个“拉伸”类的图像。

目前，使用css时，此图像会重新调整大小，因为窗口重新调整大小为屏幕宽度的100％。当窗口重新调整大小时，我也希望它向上移动。

我假设这可以用jQuery完成，但我不太确定。基本上，“顶部”css值只需要随屏幕宽度的变化而变化。

这是目前正在重新调整大小的CSS：

.stretch {
width: 100%;
height: auto;
min-height: 420px;
position: absolute;
top: -200px;
}

谢谢，

瓦德

Answer 1

var origWidth;
$(document).ready(function() {
    origWidth = $(window).width();  //store the window's width when the document loads
});

$(window).resize(function() {
    var curWidth = $(window).width(); //store the window's current width
    var delta = (curWidth- origWidth);
    $(".stretch").offset({top:($(".stretch").offset().top + delta)});
    origWidth = curWidth;
});

Answer 2

使用相对 top值（百分比等）。

移动图像或按窗口调整大小？

2 个答案: