Можно ли скрыть HTML-элемент, если динамическое содержимое требует больше места?

Question

Я хотел бы скрыть элемент HTML (в моем случае заголовок) только тогда, когда динамическое содержимое сайта расширяется настолько вертикально, что появляется полоса прокрутки. Я знаю, как скрыть элемент, но я не знаю, как вызвать событие. Я ищу что-то вроде правила @media в css, только для того, чтобы оно вызывалось не по разрешению области просмотра, а по размеру контента (по вертикали). Кто-нибудь знает решение этой проблемы? Заранее спасибо!

Answer 1

Благодаря комментарию Никса я нашел решение. Если кто-то ищет то же самое, вот работающее решение 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/