Fancybox의 PDF 크기가 제대로 조정되지 않았습니다.

Question

Fancybox API 및 포럼을 통해 지금까지 행운이 없었습니다.

기본적으로 창의 크기가 조정되면 fancybox에 포함 된 PDF의 크기가 조정되지만 fancybox 컨테이너는 브라우저의 오른쪽면에 보이지 않습니다. http://lizbmorrison.net/fancybox1.png

을 그리고 때 창 크기를 조정 :

는 Heres는 먼저 열 때 http://lizbmorrison.net/fancybox2.png

HTML :

<li class="pdf"><a class="fancypdf" href="#mydoc">View PDF</a></li> 
<div id="mydoc" style="display:none;"> 
    <embed class="embed" src="<?php echo wp_get_attachment_url($PDF->ID); ?>"></embed> 
</div> 

JS :

$(document).ready(function() { 
var width = $(window).width() * 0.9; 
var height = $(window).height() * 0.9; 
$('.embed').css('width', width).css('height', height); 
$('a.fancypdf').fancybox({ 
    'type': 'inline', 
    'margin': 0, 
    'centerOnScroll': false, 
    'hideOnContentClick': false, 
    'autoDimensions': true, 
    'autoScale': true, 
    'transitionIn': 'fade', 
    'transitionOut': 'fade', 
}); 
}); 
$(window).resize(function() { 
var width = $(window).width() * 0.9; 
var height = $(window).height() * 0.9; 
$('.embed').css('width', width).css('height', height); 
}); 

어떤 아이디어?

Answer 1

이것은 내가 정착 한 것이며, 여전히 완벽하지는 않습니다.

HTML :

<li class="pdf"><a class="fancypdf" style="padding-top: 20px;" href="<?php echo wp_get_attachment_url($PDF->ID); ?>">View PDF</a></li> 

JS는 :

$('.fancypdf').fancybox({ 
    'type': 'iframe', 
    'centerOnScroll': true, 
    'width': 800, 
    'height': 600, 
    'margin': 20, 
    'autoScale': false, 
    'autoDimensions': false 
});