Mam okno modalne, które zawiera tekst zakotwiczenia. Kiedy kliknę na ten link, musi wywołać plik PDF umieszczony w innym miejscu i wyświetlić go w wyskakującym okienku. Jak mogę to zrobić ?Jak wyświetlić plik PDF w oknie modalnym?
Uprzejmy pomoc.
Mam okno modalne, które zawiera tekst zakotwiczenia. Kiedy kliknę na ten link, musi wywołać plik PDF umieszczony w innym miejscu i wyświetlić go w wyskakującym okienku. Jak mogę to zrobić ?Jak wyświetlić plik PDF w oknie modalnym?
Uprzejmy pomoc.
Można to zrobić korzystając z okna dialogowego jQuery UI, można pobrać jQuery UI stąd Download JQueryUI
to przede te skrypty wewnątrz <head>
tagu kodu
<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 kod w obrębie tagu <body>
. Użyj iframe załadować plik pdf wewnątrz
<a href="#" id="trigger">this link</a>
<div id="dialog" style="display:none">
<div>
<iframe src="yourpdffile.pdf"></iframe>
</div>
</div>
przegłosowano, wygląda dobrze. Wypróbuję to, Tx –
Przetestowałem i opublikowałem to. Mam nadzieję, że ci to pomoże. – Swarne27
działa doskonale w większości nowoczesnych przeglądarek z wyjątkiem safari. W safari, po zamknięciu okna modelu nie zamyka samego elementu iframe. dowolny pomysł ? –
Możesz mieć element iframe wewnątrz modalnego znacznika i podać atrybut src jako link do twojego pdf. Po kliknięciu linku można wyświetlić ten modalny znacznik.
Darshan, czy uprzejmie podasz mi przykład kodu? To pomoże mi to zrozumieć. –
Można przyjrzeć się tej biblioteki: https://github.com/mozilla/pdf.js renderuje dokument w formacie PDF na stronie internetowej/HTML
Również można użyć lampy błyskowej, aby umieścić dokument do każda strona HTML tak:
<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>
można użyć iframe w swoim modalnej formie, kiedy u otworzyć okno iframe otworzy wewnątrz swojej modalnego formularza. Mam nadzieję, że renderujesz do jakiegoś otwieracza PDF z jakimś URL-em, jeśli masz zawartość pdf po prostu dodajesz zawartość do div w formie modalnej.
co masz na myśli przez okno modalne? – Swarne27
Okno modalne to okno modalne przeglądarki. Wyskakuje po kliknięciu przycisku, który będzie miał link. Kiedy klikniesz, pojawi się pop-up pdf. –
możesz użyć iframe do wyświetlenia pliku pdf, ale będzie on wyświetlany tylko wtedy, gdy wtyczka jest dostępna dla przeglądarki. Inną opcją jest użycie biblioteki js. –