chrome data-uri img height 측정 문제

2017-06-19 08:58:372017-06-19 09:08:12
top
before

chrome data-uri img height 측정 문제

2017-06-19 08:58:372017-06-19 09:08:12

언제 부터였는지 모르겠다, 바빠서 블로그에 들어와 보지 않다가, 블로그에 들어와보니 이전컨텐츠를 가져올때 높이가 정확하게 계산되지 않아 사용자 스크롤 위치를 바꾸는 부분에 문제가 있었다,

다른 모바일 브라우져에서는 괜찮았지만, pc 크롬과 모바일 크롬에서, data-uri 로 그려진 이미지에 height 가 모두 0으로 측정 되었다.

기존에는 data-uri 로 되어진 이미지는 바로 load 되어 높이가 나왔는데, 이제는 이것들 역시도 async 하게 로딩이되어, componentDidUpdate 에서 높이를 정확히 측정할수 없는것으로 예상된다.(async 하게 불러 온다 하더라도 width 와 height attribute가 있는데 왜 그럴까...)

그래서 일단은 가로세로 비율이 유지된 div 로 이미지를 감싸고, 측정하게 하였다,

정확히 어떤동작이 바뀌어서 그런것인지도 예측일뿐인데다가, 앞으로도 이와같은 변화가 없을것이라고 장담하지 못하기 때문에, 컨텐츠를 위에붙이며 사용자 스크롤을 이동시키는 방법이 옳은것인지, 다른데서는 어떻게 하고있는지 더욱궁금해 진다.

하지만, 기존에 이야기 하였던 크롬에서 컨텐츠가 느리게 로딩되는 문제는 해결된것으로 보인다,