페이지 새로 고침 작업이 정상적으로 작동하지만 처음 겹치기

내 페이지를 처음로드 할 때 이미지가 겹치고 페이지가 새로 고침되면 제대로 작동합니다. 나는 내가 뭘 잘못했는지 알지 못한다. 내 페이지 링크가 아약스의 성공에이 www.bhinderblink.com페이지 새로 고침 작업이 정상적으로 작동하지만 처음 겹치기

<script type="text/javascript"> 
    $(window).load(function() { 
     $('#container').masonry({ 
      // options 
      itemSelector: '.box', 
      columnWidth: 240, 
      isAnimated: true, 
      isFitWidth: true, 
      animationOptions: { 
       duration: 650, 
       easing: 'linear', 
       queue: false 
      } 
     }); 
    }); 


</script>

, 그것은 나는 또한, 이미지가있는 유사한 문제에 중복 된 않았습니다

function OnSuccess(response) { 
     var xmlDoc = $.parseXML(response.d); 
     var xml = $(xmlDoc); 

     pageCount = parseInt(xml.find("PageCount").eq(0).find("PageCount").text()); 

     var pic_infoVar = xml.find("pic_info"); 

     pic_infoVar.each(function() { 
      var customer = $(this); 
      //........... 

      var $picString = $("<div class='box'><img id='theImg' src='/pic/jas/" + customer.find("pic_name").text() + ".jpg" + "'/><div>Detail2</div></div>"); 
      $("#container").append($picString).masonry('appended', $picString, true); 

     }); 

     $("#imgloader").hide(); 
     $("body").css({ "opacity": "100" }); 
    }

출처

2012-12-30 Jasbir Bhinder

모든 것이 좋아 보인다 - :

이보십시오. 브라우저에서 캐시를 지우거나 사용하지 않도록 설정하십시오. – stefanz

20 번에서 2 번 잘 작동합니다. 먼저 페이지를 완전히 닫은 다음 2 번 3 번 다시 열어보십시오. 그러면 다음 15 번 사진을 스크롤하여 아래로 스크롤하면 확인할 수 있습니다. 하지만 u 새로 고침 페이지를 열면 사진을 완벽하게로드합니다. –

문제가 어디에 있는지는 모르겠지만 처음에는 콘솔에 표시된 오류를 해결해야합니다. http://img822.imageshack.us/img822/9118/2012123017h2815.jpg. – stefanz

을되는 XMLObject에서 데이터를 가져 오기 첫 번째 로딩 시간. 나는 먼저 이미지를 로딩하여 에 의해 이것을 극복했다.

$(".id").imagesLoaded(function(){ 
    $('.id').masonry({ 
       itemSelector: '.scrapcontent', 
       columnWidth: 3, 
       isAnimated:true, 
       animationOptions: { 
        duration: 700, 
        easing:'linear', 
        queue :false 
       } 
     }); 
}

이미지가로드되면 사용자의 조적 의무 만 시작되어야합니다. 정상적으로 작동합니다.

출처

2013-03-21 18:20:41 user2196414

콘텐츠 (이미지)가 완전히로드되기 전에 스크립트가 실행되기 때문입니다. 따라서 위치 오류. 나는 당신의 연결을 확인

<head> 
<script> 
     $(window).load(function(){ 
      $('#selector').masonry({ 
       itemSelector : '.item', 
       columnWidth : 200, 
       isAnimated: true, 
       animationOptions: { 
        duration: 700, 
        easing: 'linear', 
        queue: false 
       } 
      }); 
     }); 
</script> 
</head>

출처

2016-09-03 12:20:09

페이지 새로 고침 작업이 정상적으로 작동하지만 처음 겹치기

답변

관련 문제