resize event

最近犯了一個錯
我綁了一個 window resize event
function 裡面是讀圖片回來後
parentElement.appendChild(img)

電腦看都好好的
結果用手機瀏覽就出問題了

我做的網頁其實很簡單
就是很多張的圖片一個接一個顯示出來而已
可是在手機上看的時候
每往下滑一段
就會觸發 resize event 一次
我算算要從第一張圖跳到第二張圖
整整觸發 11 次 resize event
實在太可怕了...

問了頭頭才知道
因為手機不會一次把圖畫完
滑到接下來的區塊後就會變更 window.innerHeight

最後 function 長這樣

window.addEventListener('resize', () => {
   parentElement.innerHTML = '';
   // blah blah
   parentElement.appendChild(img);
});