HTML Image lazy loading[느린 로딩] #2
#1편에서 언급했듯이 img태그를 쓰지 못하는 경우가 있다. 특히 img태그를 쓰지 않고 이미지를 화면에 표시하는 방법을 쓰는 경우가 있다. 예를 들면 div태그에 background-image를 이용하여 표시하는 경우가 이에 해당한다. 당연히 이 div태그에는 loading속성은 존재하지 않기에(css도 없는 듯) Lazy-Loading은 javascript로 구현해 낼 수 밖에 없다. 이로인해 img태그의 loading속성은 무용지물이 되지만, 그래도 javascript로 만들면 제어가 가능하기에 오히려 장점도 많으니 이 방법을 이용해 보자. 시나리오는 다음과 같다. [사용자가 "스크롤"할 때마다~] 1. 페이지내의 "lazy"가 있는 모든 요소를 가지고 온다. 이 때 이 요소에는 data-imgsr..
web/javascript
2020. 12. 14. 07:00
NOTICE
RECENT ARTICLES
RECENT REPLIES
- Total
- Today
- Yesterday
LINK
TAG
- 애드센스
- TTS
- OpenGL ES
- 사용료
- ComputeShader
- 전기세
- 컴퓨트쉐이더
- choreographer
- 재테크
- 에어콘
- gpgpu
- 전기요금
- 경제보복
- 안드로이드
- 티스토리
- Android
- 에어컨
- 컴퓨트셰이더
- 적금
- 예금
- 블로그
- 금리
- 공유 컨텍스트
- 애드핏
- 아끼는 법
- 재태크
- 전기료
- OpenGLes
- texture
- 텍스처
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 | 31 |
Article Box