将元素对齐到窗口的底部，但允许滚动到下面的内容

我正在编程一个jQuery的滑块，现在我有宽度设置为100％，我希望它对齐到窗口的底部，不管窗口如何被调整大小。我已经找到了方法来让它在您向下滚动时始终保持最低点，但我不想要这样。我希望能够在此滑块下滚动以获取更多内容。将元素对齐到窗口的底部，但允许滚动到下面的内容

本网站显示我正在寻找的功能。我试图用萤火虫对它进行检查，发现它是如何发生的，但我无法弄清楚。

http://pixelthemes.net/immersion/

感谢您的帮助！

来源

2012-07-12 Mike Schoch

您可以简单地通过计算尺寸并将画廊调整到底部来实现此目的。

var resize = function() { 
    var availHeight = window.innerHeight; 
    // you need to either calculate 
    // or set a fixed offset from the top for content above 
    var offset = 80; 

    document.getElementById("slider").style.height = availHeight - offset + "px"; 
} 

window.addEventListener("resize", resize, false); 
window.addEventListener("load", resize, false);

假设你的滑块有100％的宽度，它应该完全按你想要的做。如果您的滑块上方的内容高度为80像素，则它应该完全粘贴到窗口底部，如果它一直向上滚动。

来源

2012-07-12 16:47:22

所以我把它插入我的javacript文件，它没有任何效果。我有双重检查和宽度设置为100％，我甚至改变我的滑块，以允许可调整的高度。有什么建议么？ – 2012-07-14 15:02:36

这取决于您使用的浏览器是否支持'addEventListener'。另外，如果不知道您的确切文档结构，则无法告诉发生了什么问题。 – 2012-07-15 19:11:37

对不起，我的坏。我只注意到我在那里有一个错字。我混合了陪审团和DOM ID。 – 2012-07-15 19:18:21

将元素对齐到窗口的底部，但允许滚动到下面的内容

回答

相关问题