时间戳

首页 > 解决方案 > 仅当另一个 div 有滚动时才显示一个 div

javascript - 仅当另一个 div 有滚动时才显示一个 div

问题描述

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

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

我需要检测溢出，只有当它是活动的，如果是这样，显示一个隐藏的 div。

观看现场演示（jsfiddle）

我尝试添加脚本，但这是一项行不通的发明......

提前致谢！

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>

标签： javascript

解决方案

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

这是更正的小提琴。

推荐阅读