1 <html> 2 <head> 3 <meta charset="UTF-8"> 4 <title>Document</title> 5 <style type="text/css"> 6 .lightbox{ 7 position: fixed; 8 top: 0px; 9 left: 0px; 10 height: 100%; 11 width: 100%; 12 z-index: 7; 13 opacity: 0.3; 14 display: block; 15 background-color: rgb(0, 0, 0); 16 display: none; 17 } 18 .pop,iframe{ 19 position: absolute; 20 left: 50%; 21 top:0; 22 width: 893px; 23 height: 100%; 24 margin-left: -446.5px; 25 z-index: 9; 26 } 27 </style> 28 <script src="js/pdf.js" type="text/javascript"></script> 29 <script type="text/javascript"> 30 function showPdf(isShow) { 31 var state = ""; 32 if (isShow) { 33 state = "block"; 34 } else { 35 state = "none"; 36 } 37 var pop = document.getElementById("pop"); 38 pop.style.display = state; 39 var lightbox = document.getElementById("lightbox"); 40 lightbox.style.display = state; 41 } 42 function close() { 43 showPdf(false); 44 } 45 </script> 46 </head> 47 <body> 48 <ul> 49 <li><a href="http://h5.xxx.com/1/333.pdf" target="pdfContainer" onclick="showPdf(true)">0001_pdf</a></li> 50 </ul> 51 <div class="lightbox" id="lightbox"></div> 52 <div id="pop" class="pop" style="display: none;"> 53 <a href="javascript:close()" style=" 54 position: absolute; 55 right: -90px; 56 display: inline-block; 57 width: 80px; 58 height: 30px; 59 " id="close">关闭</a> 60 <iframe src="" frameborder="0" id="pdfContainer" name="pdfContainer"></iframe> 61 </div> 62 </body> 63 </html>
pdf.js打开PDF可跨域
免责声明！
本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。