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日

相关文章

  • 基于vue 动态菜单 刷新空白问题的解决

    那么让我们来详细讲解一下“基于Vue动态菜单刷新空白问题的解决”的完整攻略。 首先,我们需要了解静态菜单和动态菜单的区别。静态菜单是指在网站中写死的菜单,如果需要更改菜单内容或数量,就需要修改网站代码,并重新发布。而动态菜单是指在后台通过接口获取数据来动态生成菜单的方式,可以根据数据的变化而实现菜单的更新。 在Vue中,我们可以通过组件来实现动态菜单。常见的…

    JavaScript 2023年6月11日
    00
  • Javascript获取窗口(容器)的大小及位置参数列举及简要说明

    下面我来详细讲解一下”Javascript获取窗口(容器)的大小及位置参数列举及简要说明”的攻略。 获取容器大小 要获取容器大小,我们可以使用JavaScript中的clientWidth和clientHeight属性,它们会返回容器内部的宽度和高度。这里的容器可以是浏览器窗口,也可以是网页中的div、iframe等元素。 示例1:获取窗口的大小 const…

    JavaScript 2023年6月11日
    00
  • 原生JavaScript编写俄罗斯方块

    编写俄罗斯方块是一个非常有趣和实用的JavaScript项目。以下是一些步骤和示例代码,可以帮助您开始编写自己的俄罗斯方块游戏。 步骤一:创建HTML文件 首先,我们需要创建一个HTML文件,在其中添加一个canvas元素来展示俄罗斯方块游戏。以下是一个示例HTML文件: <!DOCTYPE html> <html> <head…

    JavaScript 2023年6月10日
    00
  • 在网页里看flash的trace数据的js类

    要在网页中查看Flash的trace数据,可以使用以下步骤: 导出trace数据在Flash中,使用trace()函数输出调试信息。在发布Flash时,选择“在文件中编写日志文件”选项。这样,在运行Flash时,会在指定的位置生成一个日志文件。 导入trace数据到网页中导入trace数据的工具是js类,例如:FlashConsole。FlashConsol…

    JavaScript 2023年6月10日
    00
  • 详解JavaScript编程中正则表达式的使用

    详解JavaScript编程中正则表达式的使用 正则表达式是指用来匹配字符组成的一种模式。在JavaScript编程中,正则表达式被广泛应用于对文本数据的处理。本文将详细讲解JavaScript编程中正则表达式的使用,帮助读者掌握相关知识。 正则表达式的基础语法 正则表达式的基础语法是由若干个字符和特殊字符组成的模式,用于对文本进行匹配和处理。一些常用的正则…

    JavaScript 2023年6月10日
    00
  • javascript引导程序

    JavaScript引导程序是一种在HTML文档加载时立即执行的代码块。这种代码块一般用于页面初始化,为用户提供更好的用户体验。下面我将为你详细讲解如何编写和使用JavaScript引导程序。 编写JavaScript引导程序 编写JavaScript引导程序需要遵循以下步骤: 在HTML文档内添加一个script元素。 给script元素添加type属性,…

    JavaScript 2023年5月19日
    00
  • JS获取url链接字符串 location.href

    获取当前网页的URL链接字符串是一个常见的需求,而在JavaScript中,我们可以通过location.href属性来实现。 location.href是一个字符串,包含当前页面的完整URL。你可以直接打印location.href来查看当前页面的URL。 示例一:获取当前页面的URL并显示在页面上 <!DOCTYPE html> <ht…

    JavaScript 2023年6月11日
    00
  • nuxt中使用路由守卫的方法步骤

    下面是详细讲解”nuxt中使用路由守卫的方法步骤”的完整攻略。 什么是路由守卫? 路由守卫是用来监听路由跳转的钩子函数,我们可以在路由跳转过程中对路由做出一些拦截或者其他操作,比如登录校验、数据埋点等。 Nuxt中使用路由守卫的方法步骤 1. 在 nuxt.config.js 中配置路由 要使用路由守卫,必须先在 nuxt.config.js 中配置好路由,…

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