Как отобразить pdf в модальном окне?

У меня есть модальное окно, в котором содержится якорный текст. Когда я нажимаю на эту ссылку, она должна вызывать PDF-файл, размещенный где-то в другом месте, и отображать его во всплывающем окне. Как я могу это сделать ?Как отобразить pdf в модальном окне?

Просьба помочь.

источник

2012-11-09 The Dark Knight

Что вы подразумеваете под модальным окном? – Swarne27

Модальное окно - это модальное окно браузера. Он появляется, когда нажимается кнопка., На которой будет ссылка. Когда нажимается эта кнопка, появляется всплывающее окно в формате pdf. –

вы можете использовать iframe, чтобы показать свой pdf-файл, но он покажет только, доступен ли плагин для браузера. Другой вариант - использовать библиотеку js –

Вы можете сделать это, используя с диалогом JQuery UI, вы можете загрузить JQuery UI здесь Download JQueryUI

Включите эти сценарии первые внутри <head> тега

<link href="css/smoothness/jquery-ui-1.9.0.custom.css" rel="stylesheet"> 
<script language="javascript" type="text/javascript" src="jquery-1.8.2.js"></script> 
<script src="js/jquery-ui-1.9.0.custom.js"></script>

JQuery код

<script language="javascript" type="text/javascript"> 
    $(document).ready(function() { 
    $('#trigger').click(function(){ 
     $("#dialog").dialog(); 
    }); 
    });     
</script>

HTML код в пределах <body> тег. Используйте IFRAME, чтобы загрузить файл в формате PDF внутри

<a href="#" id="trigger">this link</a> 
<div id="dialog" style="display:none"> 
    <div> 
    <iframe src="yourpdffile.pdf"></iframe> 
    </div> 
</div>

источник

2012-11-09 10:23:31 Swarne27

upvoted, хорошо выглядит. Попробуем, Tx –

Я протестировал и разместил его. Надеюсь, это поможет вам. – Swarne27

он отлично работает с большинством современных браузеров, кроме сафари. В сафари, закрывая окно модели, он не закрывает сам iframe. Есть идеи ? –

У вас может быть iframe внутри модальной разметки и указать атрибут src как ссылку на ваш pdf-файл. По щелчку ссылки вы можете показать эту модальную разметку.

источник

2012-11-09 10:01:45 Darshan

Даршан, не могли бы вы дать мне пример кода? Это поможет мне понять это. –

Вы можете посмотреть на этой библиотеке: https://github.com/mozilla/pdf.js он делает PDF документа в Web/HTML странице

Также вы можете использовать Flash, чтобы встроить документ в любой HTML страницы так:

<object data="your_file.pdf#view=Fit" type="application/pdf" width="100%" height="850"> 
    <p> 
     It appears your Web browser is not configured to display PDF files. No worries, just <a href="your_file.pdf">click here to download the PDF file.</a> 
    </p> 
</object>

источник

2012-11-09 10:33:37 infinity

вы можете использовать IFRAME в вашей модальной форме, когда и открыть окно IFrame его открыть внутри вашей вашей модальной формы. я надеюсь, что вы оказываете какой-либо PDF-открыватель с некоторым URL-адресом, если у вас есть содержимое в формате pdf, просто добавьте содержимое в div в модальной форме.

источник

2012-11-09 10:34:55

Как отобразить pdf в модальном окне?

ответ

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