简介

PDF.js is a Portable Document Format (PDF) viewer that is built with HTML5.

PDF.js is community-driven and supported by Mozilla Labs. Our goal is to create a general-purpose, web standards-based platform for parsing and rendering PDFs.

开源地址：https://github.com/mozilla/pdf.js

下载后不能直接使用，需要重新构建，不熟悉将会非常麻烦

构建好的程序包：http://cnblogs.com/files/xiangliuyunyang/build.zip

如果你想自己动手，看看这篇http://blog.csdn.net/hyhbyl/article/details/20994945

示例

引用文件，直接复制下文可以直接使用

<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>课程详情</title>

    <style type="text/css">

    </style>

    <script src="~/Scripts/jquery-1.10.2.min.js"></script>

    <script src="~/Scripts/plugins/pdfjs/pdf.js"></script>

    <script src="~/Scripts/plugins/pdfjs/pdf.worker.js"></script>

    <script type="text/javascript">

        var var_filepath = decodeURIComponent("@filepath");//不能跨域

        var var_win_height = $(window).height();

        $(document).ready(function () {

            resetPlayerSize();

        });

        $(window).resize(function () {

            resetPlayerSize();

        });

        function resetPlayerSize() {

            var_win_height = $(window).height();

            $(".tmPlayer").css({ "height": var_win_height + "px" });

        }

    </script>

</head>

<body style="margin: 0;overflow: hidden">

    <div id="tmPlayer" class="tmPlayer" style="height: 557px; width: 100%; height: 100%"></div>

    <script type="text/javascript">

        $('.tmPlayer').html('<iframe frameBorder="0" scrolling="no" src="/Scripts/plugins/pdfjs/generic/web/viewer.html?file=' +

            var_filepath +

            '" style="width:100%; height:100%;"></iframe>');

    </script>

</body>

</html>

参考：http://www.cnblogs.com/xiangliuyunyang/p/5956453.html

HTML5在线预览PDF的更多相关文章

  1. WEB在线预览PDF

    这是我在博客园发表的第一篇文章.以后会陆续把在线预览其他格式文档的解决方案发表出来. 解决思路:把pdf转换成html显示. 在线预览pdf我暂时了解3种解决方案,欢迎大家补充. 方案一: 利用pdf ...

  2. 网页中动态嵌入PDF文件/在线预览PDF内容https://www.cnblogs.com/xgyy/p/6119459.html

    #网页中动态嵌入PDF文件/在线预览PDF内容# 摘要:在web开发时我们有时会需要在线预览PDF内容,在线嵌入pdf文件: 问题1:如何网页中嵌入PDF: 在网页中: 常用的几种PDF预览代码片段如 ...

  3. #网页中动态嵌入PDF文件/在线预览PDF内容#

    摘要:在web开发时我们有时会需要在线预览PDF内容,在线嵌入pdf文件: 问题1:如何网页中嵌入PDF: 在网页中: 常用的几种PDF预览代码片段如下: 代码片段1: 1 <object ty ...

  4. 网页嵌入pdf、在线预览pdf工具及插件（转）

    摘要:在web开发时我们有时会需要在线预览PDF内容,在线嵌入pdf文件: 问题1:如何网页中嵌入PDF: 在网页中: 常用的几种PDF预览代码片段如下: 代码片段1: 1 <object ty ...

  5. FlexPaper+SWFTool+操作类=在线预览PDF

    引言 由于客户有在线预览PDF格式的需求,在网上找了一下解决方案,觉得FlexPaper用起来还是挺方便的,flexpaper是将pdf转换为swf格式的文件预览的,所以flexpaper一般和swf ...

  6. 在线预览PDF

    FlexPaper+SWFTool+操作类=在线预览PDF   引言 由于客户有在线预览PDF格式的需求,在网上找了一下解决方案,觉得FlexPaper用起来还是挺方便的,flexpaper是将pdf ...

  7. FlexPaper+SWFTool+操作类=在线预览PDF(转)

    引言 由于客户有在线预览PDF格式的需求,在网上找了一下解决方案,觉得FlexPaper用起来还是挺方便的,flexpaper是将pdf转换为swf格式的文件预览的,所以flexpaper一般和swf ...

  8. 用pdf.js实现在移动端在线预览pdf文件

    用pdf.js实现在移动端在线预览pdf文件1.下载pdf.js    官网地址:https://mozilla.github.io/pdf.js/ 2.配置    下载下来的文件包,就是一个demo ...

  9. .net mvc使用FlexPaper插件实现在线预览PDF,EXCEL,WORD的方法

    FlexPaper插件可以实现在浏览器中在线预览pdf,word,excel等. 在网上看到很多关于这个插件实现预览的技术,但是很难做到word和excel在线预览. pdf很好实现. 首先下载相关的 ...

随机推荐

  1. 1.Eureka

    分布式系统中,当B的数量越来越多的时候,A只需要从注册中心获取B注册的服务,而不需要直接从B中获取服务,答案显而易见. application.yml: eureka: client: service ...

  2. spring boot 2.0.3+spring cloud （Finchley）3、声明式调用Feign

    Feign受Retrofix.JAXRS-2.0和WebSocket影响,采用了声明式API接口的风格,将Java Http客户端绑定到他的内部.Feign的首要目标是将Java Http客户端调用过 ...

  3. HDU 1017(** **）

    题意是给定 n,m,问有多少组(a,b)满足 0 < a < b < n 而且 (a ^ 2 + b ^ 2 + m) / ( a * b ) 是整数. 直接模拟即可. 代码如下: ...

  4. windows10下TensorFlow安装记录

    1.安装anaconda 安装最新版:https://repo.anaconda.com/archive/Anaconda3-5.3.0-Windows-x86_64.exe 加入环境变量: path ...

  5. Ext.net资源地址

    nuget:https://www.nuget.org/packages/Ext.NET/4.1.0 示例:https://examples1.ext.net/#/GridPanel/WebServi ...

  6. 【SRM-06 D】五色战队&&【codeforces 788E】 New task

    原题链接:788E - New task Description 游行寺家里人们的发色多种多样,有基佬紫.原谅绿.少女粉.高级黑.相簿白等. 日向彼方:吾令人观其气,气成五彩,此天子气也. 琉璃:我们 ...

  7. ubuntu安装GBK编码

    1 添加GBK编码 sudo vim /var/lib/locales/supported.d/local en_US.UTF-8 UTF-8 zh_CN.UTF-8 UTF-8 zh_CN.GBK ...

  8. 贝叶斯网络与LDA

    一.一些概念 互信息: 两个随机变量x和Y的互信息,定义X, Y的联合分布和独立分布乘积的相对熵. 贝叶斯公式: 贝叶斯带来的思考: 给定某些样本D,在这些样本中计算某结论出现的概率,即 给定样本D ...

  9. python之第三方模块安装

    1. 直接打开cmd窗口运行 pip install xxx   #可联网情况下使用,联网下载 xxx表示要安装的模块名称 pip问题及解决方法: 1. 配置环境变量,将如下两个路径都加到系统path ...

  10. 虚拟机克隆后无法上网的解决（Centos7为例）

    说明:我的虚拟机之前配置的为静态ip 解决步骤: (1)更换mac地址 (2)删除 etc/udev/rules.d/70-persistent-net.rules 删除后重启机器,系统会自动生成一个 ...