접속자가 많은 사이트의 경우 게시물에 그림이 많으면, 서버에 부담이 많이 간다… 게시물을 불러들일 때 현재 화면에 표시되는 그림만 불러오고, 나머지 화면밖의 것들은 스크롤을 해서 화면의 보이는 위치로 옮겨질 때에 읽어들이도록하는 플러긴이다.
대신 img 태그를 수정해야 한다.
<img class="lazy" data-original="img/example.jpg" width="765" height="574">
Lazy Load Plugin for jQuery에서 플러그인을 다운받고 사이트에 적용하자. 해당 플러그인은 제목에서처럼 jQuery 플러그인 위에서 작동하기때문에 항상 jQuery를 먼저 로드한 후에 넣도록 하자.
<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.lazyload.js"></script>
플러그인 로딩한 후 사용법은 뭐 여타 플러그인과 다를것 없다.
해당 객체를 lazyload()하면 끝.
jQuery('img').lazyload();
lazyload의 옵션들.
누구나 수정하실 수 있습니다. 위키 사용법 참고하세요. |
---|