• HTML5在线预览PDF


    简介

    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;  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="100%; height:100%;"></iframe>');
        </script>
    
    </body>
    </html>

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

  • 相关阅读:
    Apache Cassandra 4.0新特性介绍
    NoSQLBench压测工具入门教程
    赵洋:深入了解Materialized View
    PHP与ECMAScript_1_变量与常量
    HTTP_5_通信数据转发程序:代理、网关、隧道
    HTTP_4_返回结果的HTTP状态码
    HTTP_3_HTTP报文
    HTTP_2_HTTP协议概要
    HTTP_1_Web及网络基础
    一个完整的产品设计流程——家庭安全管家
  • 原文地址:https://www.cnblogs.com/xcsn/p/7104819.html
Copyright © 2020-2023  润新知