javascript - 检测有多少 div 超出窗口高度

Question

我有一个固定的 div，我想将它放在许多背景图片之上。问题是，如果这个固定的 div 比窗口高，它就不会滚动，这意味着内容丢失了。我试过使用 max-height: 100% 和 y-overflow:scroll; 但没有成功。

我想出了一个使用以下 javascript 的解决方法:

<script>
  $(window).scroll(function(){
    var css = {};
    if  ($(window).scrollTop() > 120){
         css = { top:'0'};
    } 
    else {
            css = {top:'120'};
    }
    $('#writtenContent').animate(css,{duration:200,queue:false});
  });
</script>

它向上移动，但由于多种原因这并不理想。我希望要么能够知道有多少 div 被隐藏，然后向上移动该数量，要么让固定的 div 可滚动。理想情况下，这些中的任何一个都应该只在必要时发生，即如果 div 适合窗口，则不采取任何行动。

任何想法都会很棒!

===============更新=================

大家好 - 这是一个快速 jsfiddle显示事物的类型。它是精简版，但显示了我遇到的问题。如果窗口的大小调整为小于包含内容的 div，我们将松开它。

Answer 1

好吧，首先，你说它是一个固定的 div，这通常意味着 position:fixed 但是你说 position:relative？这些指的是什么？但它确实应该滚动。你说你试过 y-overflow 但那当然行不通。它是 overflow-y 之后是 y。再试一次，看看它是否有效。如果它不起作用，那么您将需要发布所有相关代码和样式，以便我们可以看到发生了什么。

它也有点老套，但请尝试使用小于 100% 的不同百分比的 max-height: 来查看它是否能正常工作。