1、使用jquery.media.js预览PDF



  1. <!DOCTYPE html>
    2. 

  2. <html>
    3. 

  3. <head>
    4. 

  4. <meta charset="utf-8" />
    5. 

  5. <title>01使用jquery.media插件进行PDF预览</title>
    6. 

  6. <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
    7. 

  7. <script type="text/javascript" src="js/jquery.media.js"></script>
    8. 

  8. </head>
    9. 

  9. <script>
    10. 

  10. $(document).ready(function() {
    11. 

  11. $('div.media').media({
    12. 

  12. width: 1200,
    13. 

  13. height: 600,
    14. 

  14. src: "生活规律.pdf"
    15. 

  15. });
    16. 

  16. });
    17. 

  17. </script>
    18. 

  18. <body>
    19. 

  19. <div class="media"></div>
    20. 

  20. </body>
    21. 

  21. </html>


2、使用PDF.JS在线查看PDF




  1. <!DOCTYPE html>
    2. 

  2. <html>
    3. 

  3. <head>
    4. 

  4. <meta charset="UTF-8">
    5. 

  5. <title>02使用pdf.js插件进行PDF预览</title>
    6. 

  6. </head>
    7. 

  7. <body>
    8. 

  8. <a href="#" onclick="window.open('js/html5-online-pdf-viewer/web/viewer.html?file=/浏览器实现PDF预览/生活规律.pdf');">
    9. 

  9. 查看生活规律.pdf
    10. 

  10. </a>
    11. 

  11. </body>
    12. 

  12. </html>


3、利用PDF.JS插件解决了本地pdf文件在线浏览问题（根据需要隐藏下载功能，只保留打印功能）


隐藏下载功能：


在viewer.html更改即可


更改之前




更改之后




即增加   style="visibility:hidden"    就可隐藏下载功能。


隐藏打印等其他功能同上。


附件源码


下载地址：https://gitee.com/KingXin666/PDFPreviewOnBrowsers
												


											
浏览器实现PDF预览的更多相关文章
	

    
								
  1. PDF预览之PDFObject.js总结
		
    get from:PDF预览之PDFObject.js总结   PDFObject.js - 将PDF嵌入到一个div内,而不是占据整个页面(要求浏览器支持显示PDF,不支持,可配置PDF.js来实现 ...
    
		
    2. 
						
  2. 使用 juqery.media.js 实现 pdf 预览
		
    作用:可以实现在指定的位置预览PDF 缺点: (1)在iPad上只能预览一页PDF.(问题是iPad会将PDF转为img呈现,试了将img宽度设置为100%方法但并不好使) (2)在安卓上不能预览,依 ...
    
		
    3. 
						
  3. BrowserSync：跨浏览器实时同步预览
		
    BrowserSync:跨浏览器实时同步预览 2016.09.11 官方网站:https://www.browsersync.io/ 项目仓库:https://github.com/Browsersy ...
    
		
    4. 
						
  4. Pdf预览功能实现（asp.net）
		
    asp.net中使用 1.pdf预览功能实现的插件是pdfjs-1.5.188-dist //引入插件中相关的文件以及jquery文件 @section css{ <link rel=" ...
    
		
    5. 
						
  5. Atitit.pdf 预览 转换html attilax总结
		
    Atitit.pdf 预览 转换html attilax总结 1. Swf flash还是html1 2. pdf2htmlEX1 3. iText 5.5.0 发布,Java 的 PDF 操作类库1 ...
    
		
    6. 
						
  6. ABAP FORM打印转PDF/pdf 预览
		
    function ZSTXBC_SSFCOMP_PDF_PREVIEW. *"-------------------------------------------------------- ...
    
		
    7. 
						
  7. Android原生PDF功能实现：PDF阅读、PDF页面跳转、PDF手势伸缩、PDF目录树、PDF预览缩略图
		
    1.背景 近期,公司希望实现安卓原生端的PDF功能,要求:高效.实用. 经过两天的调研.编码,实现了一个简单Demo,如上图所示. 关于安卓原生端的PDF功能实现,技术点还是很多的,为了咱们安卓开发的 ...
    
		
    8. 
						
  8. Winforn中使用FastReport实现点击导出按钮PDF预览并弹出另存为对话框
		
    场景 FastReport安装包下载.安装.去除使用限制以及工具箱中添加控件: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/10 ...
    
		
    9. 
						
  9. pdf预览-js版本
		
    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 3.Appium处理原生与H5的嵌套
			
    环境前置准备 手机与电脑USB连接,开启USB调试模式,通过adb devices可查看到此设备. 电脑端.移动端安装chrome浏览器.(尽量保证移动端chrome版本低于电脑端) App webv ...
    
			
    2. 
						
  2. Transport & Buffer
			
    Transport 传输API的核心是Channel接口,用于所有的出站操作. 每个Channel都会分配一个ChannelPipeline和ChannelConfig.ChannelConfig负责 ...
    
			
    3. 
						
  3. CVE-2018-7566
			
    概念解读 什么是竞争条件? 由于两个或者多个进程竞争使用不能被同时访问的资源,使得这些进程有可能因为时间上推进的先后原因而出现问题,这叫做竞争条件(Race Condition). 什么是互斥锁? 在 ...
    
			
    4. 
						
  4. TEST mathjax
			
    这里是第一个公式 $ F = ma^2 $ \[ \text{Reinforcement Learning} \doteq \pi_* \\ \quad \updownarrow \\ \pi_* \ ...
    
			
    5. 
						
  5. 深度强化学习介绍   【PPT】 Human-level control through deep reinforcement learning  （DQN）
			
    这个是平时在实验室讲reinforcement learning 的时候用到PPT, 交期末作业.汇报都是一直用的这个,觉得比较不错,保存一下,也为分享,最早该PPT源于师弟汇报所做.
    
			
    6. 
						
  6. conda创建虚拟环境
			
    可能自己常常会遇到一个这样的问题,自己服务器安装的是python2,但是现在有的代码是基于python3的啊 怎么办?自己将代码转换成python2的呗,是的,我曾经就这样做过,但是真的是很鸡肋 更有 ...
    
			
    7. 
						
  7. Shell    #*/ 和 %/*
			
    #!/bin/bash i="this/is/a/path.config" name=${i#*/} path=${i%/*} echo $name echo $path is/a ...
    
			
    8. 
						
  8. Django中的应用
			
    1.什么是应用 应用就是网站中的一个独立的程序模块,在Django中,主目录一般不处理具体的请求,主目录一般要处理的是项目的初始化操作以及请求的分发(分布式请求处理).而具体的请求是由各个应用去处理. ...
    
			
    9. 
						
  9. windows server/windows同一系统下建立两个目录之间的映射关系
			
    应用场景,如下: 当两个不同的项目共享同一个资源目录.同一个数据库时,由于两项目根目录不一样,再加上部分项目可能有入口重写规则限制了用户的访问权限. 因此,我们可以利用window 服务器给我们提供的 ...
    
			
    10. 
						
  10. 《DSP using MATLAB》Problem 6.12
			
    代码: %% ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ %% Output In ...
    
			
    11.