html 요소로드 방지/연기

내 포트폴리오를 개발할 때 페이지로드가 완료 되려면 모든 이미지를로드해야하므로 페이지를로드하는 데 오랜 시간이 걸린다는 것을 깨달았습니다.html 요소로드 방지/연기

그렇다면로드를 막거나 중지 한 다음 나중에 허용 할 수있는 방법이 있는지 궁금합니다.

로드 중의 다른 요소를 즉시 로딩하지 못하게 한 다음, #title이라고 말하고, .images를로드합니다.

이 경우 가능합니까?

미리 감사드립니다. 이 같은

2012-07-23 IrfanM

사람들이 콘텐츠를보기 위해 어떤 종류의 자리 표시자를 클릭해야할까요? 그것은 끔찍한 사용자 경험처럼 보입니다. – meagar

당신은 얼마나 많은 이미지를 가지고 있고 어떤 사이즈인지 모르지만, 당신이 잘못 생각한 것 같습니다. 어쩌면 이미지의 크기를 줄이고 어쩌면 수백을 필요로하지 않을 수도 있습니다. 느린 –

@ meagar 예, 그것은 끔찍한 UX처럼 보입니다. 하지만 그건 내가하려고하는 것이 아닙니다. – IrfanM

뭔가 :

HTML

<img src="" class="lazyload" data-attr="image1.jpg" alt="Alt" title="Title" width="50" height="50" />

자바 스크립트는

$('#title').click(function(){ 
    $('.lazyload').each(function(){ 
     $(this).attr('src',$(this).attr('data-attr')); 
    }); 
});

또는 당신은 약간 다른 기능에 대한 LazyLoad 플러그인을 사용할 수 있습니다.

2012-07-23 20:37:38 wanovak

흠,이게 재미있어 보여요. 그래서 이것은 이미지 요소를로드하지만 소스는로드하지 않습니다 (아직 src에 대한 값이 없으므로). 그런 다음 #title을 클릭하면 소스 속성의 값이 추가됩니다. 즉,로드 된 것입니다. 맞습니까? – IrfanM

당신은 그것을 가지고 :-). – wanovak

괜찮습니다. 도움에 감사드립니다. :-) – IrfanM

답변