지연 팬시 박스가 열리지 만 데이터로드가 지연되지 않습니다

Question

인용문으로 구분 된 줄이있는 텍스트 파일이 있습니다. 에 class="quotes"이라는 줄을로드하고 <a> 태그의 jquery click 함수를 사용하여 숨겨진 div 안에 줄을로드합니다. 이것은 잘 작동합니다.

이 앵커는 또한 Fancybox 2 라이트 박스를 실행하고 #quote-div (숨겨진 div의 div 내부)의 내용을 인라인으로로드합니다. 이것은 또한 작동합니다.

문제는 너무 빠르게 발생한다는 것입니다. 나는 텍스트의 로딩을 빠르게 유지하고 Fancybox를 약간 지연시킬 필요가있다.

가끔 Fancybox가 열릴 때로드 된 텍스트의 창 높이가 다시 조정되므로 더듬이가 있습니다. 클릭 대신 마우스 오버시 텍스트로드를 시도했지만 Chrome에서 <a> 태그 위로 마우스를 이동하면 다른 마우스 오버가 트리거됩니다.

여기 몇 게시물에서 setTimeout이 발견되었지만이 상황에서 올바르게 작동하도록 코드에서 설정하는 방법을 모르겠습니다.

나는 연기가 일어나기를 원하지 않는 사이트의 다른 부분에서도 Fancybox를 사용하고 있습니다.

HTML :

<div style="display: none"> 
    <div id="quote-div"> 
     <p class="quotes">... content loads here...</p> 
    </div> 
</div> 

<a id="q-click" class="clickBlock fancybox" href="#quote-div">&nbsp;</a> 

JQuery와 기능 :

$('#q-click').click(function() { 
    $.get('/assets/quotes.txt', function(data) { 
     var quotes = data.split("\@"); 
     var idx = Math.floor(quotes.length * Math.random()); 
     $('.quotes').html(quotes[idx]); 
    }); 
}); 

Fancybox 코드 :

$(".fancybox").fancybox({ 
    helpers: { 
     title : { 
      type : 'inside' 
     }, 
     overlay: { 
      locked: false 
     } 
    } 
}); 

Answer 1

난 당신이 두 개의 서로 다른 이벤트를 결합하고 있기 때문에 $.get() 콜백 내에서 프로그래밍 fancybox를 호출하려고 할 것 같은 요소에. 같은

뭔가 :

$('#q-click').click(function() { 
    $.get('/assets/quotes.txt', function (data) { 
     var quotes = data.split("\@"); 
     var idx = Math.floor(quotes.length * Math.random()); 
     $('.quotes').html(quotes[idx]); 
     $.fancybox("#quote-div", { 
      helpers : { 
       title : { 
        type : 'inside' 
       }, 
       overlay : { 
        locked : false 
       } 
      } 
     }); 
    }); 
    return false; 
}); 

그런 다음 정규 fancybox 초기화 스크립트를

$(".fancybox").fancybox()