html - 如果动态内容需要更多空间，是否可以隐藏 html 元素？

Question

只有当网站的动态内容垂直扩展到滚动条出现时，我才想隐藏一个 html 元素(在我的例子中是标题)。我知道如何隐藏一个元素，但我不知道如何触发该事件。我正在 css 中搜索类似 @media 规则的东西，只是它不应该在视口(viewport)分辨率上触发，而是内容的大小(垂直)。有谁知道这个的解决方案？提前致谢!

Answer 1

感谢 Nicks 的评论，我找到了解决方案。如果有人在寻找同样的东西，这里有一个有效的 Javascript 解决方案(不需要 JQuery):

var callback = function(){
    // Handler when the DOM is fully loaded
    // Check if the body height is bigger than the clients viewport
    if (document.body.scrollHeight > document.body.clientHeight) {
              // Assign a class with display:none (in my case 'hide')
              document.getElementById("headline").className = 'hide';
          }
  };
// This part ensures that the script will be loaded once the site is loaded  
  if (
      document.readyState === "complete" ||
      (document.readyState !== "loading" && !document.documentElement.doScroll)
  ) {
    callback();
  } else {
    document.addEventListener("DOMContentLoaded", callback);
  }

在 https://www.sitepoint.com/jquery-document-ready-plain-javascript/ 的帮助下