将div放在div的底部，除非div大于浏览器的可视区域

Question

我有一些像这样的HTML：

<div>
Some content here
<span>content here</span>
</div>

div为variable height，有时可以延伸到浏览器的视口之外。

如果可能的话，我试图弄清楚如何在Pure CSS中做到这一点，但可能是jQuery。

if(height of div stretches beyond bottom of browser window)
    position span 10 pixels above bottom of browser window
if(height of div doesn't stretch beyond bottom of browser window)
    position span 10 pixels above bottom of div

有没有办法用Pure CSS做到这一点？

Answer 1

您可以使用以下jQuery代码来检测div是否超出窗口：

if ($('div').offset().top + $('div').height() > $(window).height()) {
    // The div exceeds the view of the window
    // Execute your code here
}
else {
    // The div is within the view of the window
    // Execute your other code here
}