<div>
  <div class="hoge">hoge</div>
  <div id="piyo" class="fuga">piyo</div>
</div>

.hoge {
  height: 600px;
  width: 200px;
  background: #10bace;
}

.fuga {
  height: 600px;
  width: 200px;
  background: tomato;
}

let isDisplayed = false;
const c = (entries) => {
  if (isDisplayed) return;
  for(const e of entries.filter(e => e.isIntersecting)){
    window.alert('ちばけんま！');
    isDisplayed = true;
  }
}

const options = {
  root: null,
  rootMargin: '0px',
  threshold: 0,
};

const e = document.querySelector('#piyo');

const observer = new IntersectionObserver(c, options);
observer.observe(e);