pdf.js 使用

pdf文件能够比较好的保留源格式,传输也比较方便,现PC端浏览器基本都可直接查看pdf文件,只是界面风格不怎么统一,但是手机端查看pdf文件就不能很好的只“预览”,往往都是自动下载到本地再查看,今天分享pdf.js,主要用于在线pdf预览,平时我使用比较多的场景就是培训手册。

我用的是1.1.159,版本比较旧,解压后文件只有3.66 MB。

pdf.js 使用

 

 

使用方法如下:

一、将pdf文件放至“web”文件夹下

pdf.js 使用

 

 二、新建一个静态页——help.html

pdf.js 使用

 

 

三、部署到服务器

 

四、PC端和Phone端效果如下

pdf.js 使用

 

 pdf.js 使用

 

 附上压缩包:

 https://files.cnblogs.com/files/dysjwang/pdf.js.zip?t=1679561704

 


 

最后插一句题外话,pdf作为培训手册通过网页展现也可使用另一种方法,通过Photoshop将pdf另存为一张张图片,然后写个简单的html显示这一张张图片,作为纯静态页,在PC端和Phone端显示效果都挺不错,且打开速度很快。

原文链接:https://www.cnblogs.com/dysjwang/p/17248088.html

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:pdf.js 使用 - Python技术站

(0)
上一篇 2023年4月18日
下一篇 2023年4月18日

相关文章

  • JavaScript 数组基本操作全解

    JavaScript 数组基本操作全解 什么是 JavaScript 数组? JavaScript 数组是存储值的有序集合。它可以存储任何类型的值,例如数字、字符串和对象。 数组的每个元素都有一个数字索引,用于访问数组中的元素。 如何创建 JavaScript 数组? 可以使用以下两种方式创建 JavaScript 数组: 1.直接赋值 let fruits…

    JavaScript 2023年5月18日
    00
  • JS数组push、unshift、pop、shift方法的实现与使用方法示例

    JS数组方法push、unshift、pop、shift实现及使用方法 push方法 push() 方法用于在数组末尾添加一个或多个元素,并返回数组的长度。 语法 arrayObject.push(newelement1,newelement2,….,newelementX) 示例 var fruits = ["Banana", &q…

    JavaScript 2023年5月27日
    00
  • JavaScript的递归之递归与循环示例介绍

    以下是“JavaScript的递归之递归与循环示例介绍”完整攻略: 前言 JavaScript的递归和循环是编程中的两种常见方法,常用于处理重复性操作。递归需要注意堆栈溢出、效率等问题,而循环则需要注意控制条件和循环变量等问题。正确选择适合的方式能够让程序更加高效、简洁。本文将通过两条示例说明递归和循环的不同实现方式及其效果。 示例一:斐波那契数列 斐波那契…

    JavaScript 2023年5月28日
    00
  • JavaScript的作用域和块级作用域概念理解

    JavaScript作用域 在JavaScript中,作用域控制着变量和函数的可见性和生命周期。作用域是定义变量、函数以及访问它们的地方的一套规则。 作用域分为全局作用域和局部作用域。在函数中定义的变量、函数参数以及函数内部声明的函数都属于该函数的局部作用域。全局作用域包含了浏览器环境下的所有对象和方法,函数内部可以访问全局变量。 JavaScript作用域…

    JavaScript 2023年6月10日
    00
  • 解析ajaxFileUpload 异步上传文件简单使用

    解析ajaxFileUpload 异步上传文件简单使用攻略 异步上传文件简介 在传统的表单提交中,如果需要上传文件,则需要重新加载整个页面,用户体验并不好,而且上传大文件还会影响页面的响应速度。而异步上传则是采用ajax技术,实现上传文件的同时不刷新整个页面,从而提升用户体验。 ajaxFileUpload 简介 在实现异步上传功能的过程中,ajaxFile…

    JavaScript 2023年6月11日
    00
  • JavaScript实现简单表单验证案例

    当编写一个表单的时候,为了保证提交的数据正确性以及安全性,我们需要对用户输入的数据进行验证。而 JavaScript 可以提供灵活的表单验证功能,使得表单数据的验证更加方便和高效。 以下是一个可用于表单验证的基本攻略: 获取表单元素对象 通过使用 JavaScript的 DOM 操作获取表单元素对象,以便于后续的获取用户输入和验证数据。 示例: let in…

    JavaScript 2023年6月10日
    00
  • Webpack devServer中的 proxy 实现跨域的解决

    下面是关于Webpack devServer中的proxy实现跨域的详细攻略。 什么是跨域 跨域是指在浏览器中运行的脚本(通常指JavaScript脚本)试图访问一个不同源(协议、域名、端口号不同)的页面所产生的限制。由于同源策略的限制,JavaScript通常只能访问与包含它的页面位于同一域名下的资源。 解决跨域的方法 通常情况下,跨域的解决方法可以归纳为…

    JavaScript 2023年6月11日
    00
  • 浅谈Vue页面级缓存解决方案feb-alive (下)

    针对“浅谈Vue页面级缓存解决方案feb-alive (下)”这篇文章,我可以提供以下完整攻略: 1. 简述文章主旨 本文主要介绍了一种Vue页面级缓存的解决方案,即使用<keep-alive>的一个替代方案–<feb-alive>。文章中着重介绍了<feb-alive>的实现原理、使用方法以及与<keep-ali…

    JavaScript 2023年6月11日
    00
合作推广
合作推广
分享本页
返回顶部