jquery 플러그인은 이미지 지연 로딩 효과를 구현합니다.

페이지 로딩 시간을 줄이고 서버에 대한 부담을 줄여줍니다. 저는 자바스크립트 소스 코드를 살펴보고 거기에 작성된 지연 로드를 발견했습니다. Baidu에서 검색한 결과 이 ​​효과를 달성하는 jquery 플러그인인 jquery.lazyload가 발견되었습니다. 좋은 플러그인.
예를 들어 상대적으로 크거나 긴 웹페이지를 열면 지연 로드는 먼저 보이는 영역에 사진을 로드한 다음 스크롤할 때 해당 위치에 사진을 로드할 수 있습니다.
사진 웹사이트이고 한 페이지에 많은 사진을 로드해야 한다면 이 플러그인은 매우 좋은 선택입니다.
사용 방법은 다음 js를 인용하세요.
소스 코드 인쇄 도움말 보기

코드 복사 코드는 다음과 같습니다. 다음은 다음과 같습니다.

페이지에 다음 자바스크립트를 추가하세요.
소스 코드 인쇄 도움말 보기 1 $("img").lazyload() ;
이렇게 하면 모든 이미지가 느리게 로드됩니다. 플러그인에는 설정할 수 있는 여러 구성 항목도 있습니다.
물론 일부 사용자의 경우 위 기능이 요구 사항을 충족하지 못하는 경우 민감도 설정 방법을 살펴보겠습니다. 보다 사용자 친화적인 이 기능을 제어하기 위해 임계값을 설정할 수 있습니다.
$(“img”).lazyload({ Threshold : 200 });
임계값을 200으로 설정합니다. 이는 이미지가 표시되기 전에 200픽셀을 로드한다는 의미입니다. 물론 자리 표시자 이미지와 사용자 정의 이벤트를 설정하여 이미지 로딩 이벤트를 트리거할 수도 있습니다
소스 코드 인쇄 도움말 보기

코드 복사 코드는 다음과 같습니다:

$("img").lazyload({
placeholder : "img/grey.gif",
event : "click"
})

효과 매개변수를 정의하여 일부 이미지 표시 효과를 정의할 수도 있습니다.
소스 코드 인쇄 도움말 보기

코드 복사 코드는 다음과 같습니다:

$("img").lazyload({
placeholder : "img/grey.gif",
효과 : " fadeIn"
})

다운로드 주소: 소스, 최소화 또는 포장