2016-01-25 9 views
7

Я пытаюсь сделать масштабирование PDF всегда полной шириной внутри iframe, а при изменении размера браузера он пересчитывает масштаб PDF и устанавливает его на 100% ширину браузера.Максимальное изменение размера в браузере при изменении размера браузера

pdf parameter # view = Fit или # zoom = 100 работает над готовым документом, но я не могу заставить его обновить/пересчитать это значение при изменении размера браузера (желательно без потери позиции прокрутки).

<iframe id="readFrame" src="https://xxxxxx.pdf#view=Fit"></iframe> 

примечание: Я изменение размера IFRAME, как это:

$(document).ready(function() { 
    $(window).trigger('resize'); 
}); 

$(window).resize(function() { 

    var browser_viewportH = $(window).height(); 
    var browser_viewportW = $(window).width(); 

    var nav_height = $("#nav-bar").height() + $("#tempWrapper").height(); 
    var block_height = $("#blockContainer").height(); 

    var viewportH = browser_viewportH - (nav_height + block_height); 

    $("#readFrame").css("height", viewportH); 
}); 
+0

Мне даже не повезло загрузить pdf внутри iframe. какой браузер вы используете? –

+0

Если ваша единственная забота не потеряет позицию прокрутки, а ваш iframe находится в одном домене, вы можете связываться через iframe, чтобы сохранить положение прокрутки, перезагрузить, а затем восстановить его. – user2867288

+0

Можем ли мы получить [скрипку] (http://jsfiddle.net)? – kecer

ответ

0

Я закончил с использованием pdf.js если кто-то приходит через эту проблему ,

Проблема с использованием параметров pdf заключается в том, что они не работают в Chrome и Firefox, поскольку эти браузеры имеют свои собственные средства просмотра pdf.

С другой стороны, pdf.js поддерживается только в Chrome и Firefox, а другие имеют ограниченную поддержку, но являются функциональными, кроме < = IE8.

0

Ну я думаю, что у вас есть опечатка здесь:

$("#read iframe").css("height", viewportH); 

Должно быть

$("#readFrame").css("height", viewportH); 

Как ваш iframe имеет идентификатор «readFrame», не правда ли?

+0

Простите, что я был немного неясен в этом, либо работайте, как iframe находится внутри id #read. Исправлено с редактированием. – wadclapp

+0

mhm okay, я сделал то же самое несколько месяцев назад с pdf-viewer на основе iframe. Я просто дал iframe значение css-height «height: 100%» и скорректировал только ширину iframe в событии resize моего окна. Вы попробовали это? По крайней мере, это сработало для меня ... – Fearodin

0
<iframe id="readFrame" src="YOUR_PDF_PATH.pdf#view=Fit" style="width:100%;"></iframe> 
<script type="text/javascript"> 
$('#readFrame').css('height',$(window).height()); 
</script> 

вы можете использовать это, и это работает на изменение размеров, а также, и это не теряет свою высоту прокрутки тоже при изменении размеров ..

Смежные вопросы