>  기사  >  웹 프론트엔드  >  이미지 로딩 완료 후 이벤트 실행

이미지 로딩 완료 후 이벤트 실행

小云云
小云云원래의
2018-01-18 14:49:022080검색

이 기사는 주로 이미지 로딩 및 실행 이벤트의 예를 공유합니다. 이는 매우 좋은 참고 가치가 있습니다. 모두에게 도움이 되기를 바랍니다. .

예는 다음과 같습니다:

//图片加载
function load(imgSrc,callback) {
 var imgs = [];
 var c = 0;
 for (var i = 0; i < imgSrc.length; i++) {
  imgs[i] = new Image();
  imgs[i].src = imgSrc[i];
  imgs[i].onload = function(){
   c++
   if(c == imgSrc.length){
    if(callback){
     callback();
    }
   }
  }
 }
 return imgs;
}

적용 시나리오: 사진이 많은 일부 페이지, 진행률 표시줄 또는 읽기 비율과 같은 로딩 효과를 추가해야 하는 일부 페이지, 일반적으로 모바일 페이지가 더 일반적으로 사용됩니다.

관련 권장 사항:

배경 이미지가 로드되지 않는 문제를 해결하는 방법

두 가지 효과에 대한 JS 이미지 로드 예제 코드

흐림 표시에서 선명한 표시로 이미지 로드를 구현하는 Javascript 방법

위 내용은 이미지 로딩 완료 후 이벤트 실행의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.