Question

我对脚本有问题（我是JS中的新手，级别0），我想解决它。

问题：是否可以使用JS检测固定尺寸（340px x 120px）的div是否在内容超出固定高度时触发了溢出...？

我需要检测溢出，仅在其处于活动状态时，如果为真，则显示隐藏的div。

我尝试添加脚本，但这是一项无效的发明...

谢谢！

var displaced = document.getElementsById('flux')[0];
if (displaced.scrollHeight > displaced.offsetHeight) {

  document.getElementById("show").style.display = "block";
}

<div id="container">

  <div id="flux">

    <div id="show">Hello!</div>

    Lorem ipsum dolor sit amet <br> Consectetuer augue nibh lacus at <br> Pretium Donec felis dolor penatibus <br> Phasellus consequat Vivamus dui lacinia <br><br>

    <!--
        Ornare nonummy laoreet lacus Donec <br>
        Ut ut libero Curabitur id <br>
        Dui pretium hendrerit sapien Pellentesque <br>
        Lorem ipsum dolor sit amet <br>
        Consectetuer augue nibh lacus at <br>
        Pretium Donec felis dolor penatibus <br><br>
        Phasellus consequat Vivamus dui lacinia <br>
        Ornare nonummy laoreet lacus Donec <br>
        Ut ut libero Curabitur id <br>
        Dui pretium hendrerit sapien Pellentesque <br>
        Lorem ipsum dolor sit amet <br>
        Consectetuer augue nibh lacus at <br><br>
        Pretium Donec felis dolor penatibus <br>
        Phasellus consequat Vivamus dui lacinia <br>
        Ornare nonummy laoreet lacus Donec <br>
        Ut ut libero Curabitur id <br><br>
        Dui pretium hendrerit sapien Pellentesque <br>
        -->

  </div>
  <!-- // flux -->

</div>
<!-- // container -->

<div id="note">
  Note: The div "show" (red box) must be display = "none".<br>See CSS line 13.<br><br>And it must be display = "block" only if the scroll on the div #flux is present.
</div>

Answer 1

我在您的代码中唯一看到的错误是您编写的

var displaced = document.getElementsById('flux')[0];

尝试将其更改为

var displaced = document.getElementById('flux');

如果您更改了演示的效果，则

请参阅固定的演示：

http://jsfiddle.net/rmnkj197/

Answer 2

将var displaced = document.getElementsById('flux')[0];更改为document.getElementById('flux')（getElementById返回单个元素，因为id在文档中应该是唯一的）。另外，CSS第13行中的display: none也被注释掉了。

Here是更正后的小提琴。

仅当另一个div滚动时显示div

2 个答案: