简介

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. C# 一个特别不错的http请求类

    using System; using System.Collections; using System.Collections.Generic; using System.Collections.S ...

  2. HDU - 6313 Hack It（构造）

    http://acm.hdu.edu.cn/showproblem.php?pid=6313 题意 让你构造一个矩阵使得里面不存在四个顶点都为1的矩形,并且矩阵里面1的个数要>=85000 分析 ...

  3. PHP7 学习笔记（十一）使用phpstudy快速配置一个虚拟主机

    说明:为了windows本地开发php方便,这里推荐使用PHP集成环境phpstudy. 目的:使用域名访问项目(tinywan.test) 1.官网:http://www.phpstudy.net ...

  4. 解析ArcGis的标注（二）——认识ArcGis标注标签

    该“标注”系列博文的标注引擎使用“标准标注引擎(standard label engine)”,这个概念如不知道,可不理会,ArcGis默认标注引擎就是它. 本篇的标注语句解析使用VBScript,注 ...

  5. ssh 跳板机部署

    1.首先创建存放日志的文件夹并开放读写权限       mkdir /var/log/jump/       chmod -R 777 /var/log/jump/   2.将原有ssh程序修改为另外 ...

  6. oracle杀掉连接

    相关sql --查看当前连接 select count(*) from v$process --数据库允许的最大连接数 select value from v$parameter where name ...

  7. Echarts地图悬浮框显示多组series数据以及修改地图大小

    1.如何让echarts的地图悬浮框出现多组series数据? 2.如何更改地图默认的大小? <!DOCTYPE html> <html lang="en"> ...

  8. Newtonsoft.Json 的基本用法

    Ø  前言 说起 C# 对 JSON 的操作(序列化与反序列化),大家都会想到 JavaScriptSerializer.DataContractJsonSerializer 与 Newtonsoft ...

  9. 【深入理解JVM】：Java类继承关系中的初始化顺序

    尝试着仔细阅读thinking in java 看到一篇很好的文章http://blog.csdn.net/u011080472/article/details/51330114

  10. PHP设计——单例模式与工厂模式

    一.单例模式又称为职责模式,它用来在程序中创建一个单一功能的访问点,通俗地说就是实例化出来的对象是唯一的.所有的单例模式至少拥有以下三种公共元素:1. 它们必须拥有一个构造函数,并且必须被标记为pri ...