2012-11-09 19 views
11

Çapa metni içeren kalıcı bir pencerem var. Bu bağlantıyı tıkladığımda, başka bir yere yerleştirilmiş bir pdf'yi çağırmalı ve bir açılır pencerede göstermelidir. Bunu nasıl yapabilirim ?Modal pencerede pdf nasıl görüntülenir?

Lütfen yardım edin.

+0

Modal pencereyle ne demek istiyorsunuz? – Swarne27

+1

Bir modal penceresi, tarayıcı model penceresidir. Bir düğme tıklandığında, bir bağlantıya sahip olacak, açılır. Bu tıklandığında, bir pdf açılır. –

+0

Eğer pdf göstermek iframe kullanabilirsiniz ama sadece tarayıcı için eklenti mevcut olup olmadığını gösterecektir.Başka bir seçenek js kütüphanesi kullanmaktır –

cevap

20

jQuery UI iletişim ile kullanarak yapabilirsiniz, sen Download JQueryUI

ilk olarak bu komut <head> etiketi

<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 kod içine dahil

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

HTML buradan JQuery ui indirebilirsiniz <body> etiketinde kodu girin. Bu kütüphanede bir göz atabilirsiniz

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

upvoted, iyi görünüyor. Bunu deneyecek, Tx –

+0

Test ettim ve yayınladım. Umarım size yardımcı olur. – Swarne27

+0

, safari dışındaki modern tarayıcıların çoğunda mükemmel çalışıyor. Safari'de, model penceresini kapatırken iframe kendisini kapatmaz. Herhangi bir fikir ? –

2

Modal biçimlendirme içinde bir iframe olabilir ve bunun src özelliğini pdf bağlantınız olarak verebilirsiniz. Bağlantıyı tıkladığınızda bu biçimlendirme işaretini gösterebilirsiniz.

+0

Darshan, bana bunun herhangi bir örnek kodunu verecek misiniz? Bu onu anlamada bana yardımcı olacaktır. –

5

içindeki pdf dosyası yüklemek için bir iframe kullanın: https://github.com/mozilla/pdf.js Eğer belgeyi gömmek için Flash kullanabilirsiniz Ayrıca

Web/HTML sayfası PDF dokümanı vermektedir bunun gibi bir HTML sayfası:

<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> 
0

u iframe penceresini açtığınızda bu yüzden o senin kalıcı form içinde açmak için kalıcı form içinde iframe kullanabilirsiniz. Bazı pdf açıcılarına bazı URL'leri vermeyi umuyoruz, eğer pdf içeriğiniz varsa, içeriği sadece bir modal formdaki bir div içine ekleyiniz.

İlgili konular