当前位置： 首页 > news >正文

pdfh5在线预览pdf文件

news 2025/12/16 10:35:54

前言

pc浏览器和ios的浏览器都可以直接在线显示pdf文件，但是android浏览器不能在线预览pdf文件，如何预览pdf文件？

Github: https://github.com/gjTool/pdfh5
Gitee: https://gitee.com/gjTool/pdfh5

使用pdfh5预览pdf

  1. 编写预览页面
<html>
<head><meta charset="UTF-8"><title>pdfh5预览</title><link rel="stylesheet" href="pdfh5/css/pdfh5.css"/><link rel="stylesheet" href="pdfh5/css/style.css"/><style type="text/css"></style>
</head>
<body>
<div id="demo"></div>
</body>
<script src="pdfh5/js/pdf.js" type="text/javascript" charset="utf-8"></script>
<script src="pdfh5/js/pdf.worker.js" type="text/javascript" charset="utf-8"></script>
<script src="pdfh5/js/jquery-3.6.0.min.js" type="text/javascript" charset="utf-8"></script>
<script src="pdfh5/js/pdfh5.js" type="text/javascript" charset="utf-8"></script>
<script>var pdfh5 = new Pdfh5('#demo', {pdfurl: "./default.pdf" //可以是你的pdf链接地址/xxx/xxx.pdf});
</script>
</html>

  1. 下载需要用到的css和js文件
    https://github.com/gjTool/pdfh5
    请见Git仓库中寻找

  2. 访问网页测试
    在这里插入图片描述

pdfh5 扩展API

见 https://gitee.com/gjTool/pdfh5#pdfh5js
在这里插入图片描述

遇到的问题

1. 显示页面高度很小，不正常显示

在这里插入图片描述
解决办法： 找到pdfh5.css, 屏蔽height属性

.pdfjs .pdfViewer .pageContainer img {width: 100%;/*height: 100%;*/position: relative;z-index: 100;/* user-select:none; */
}

在这里插入图片描述

相关文章：

pdfh5在线预览pdf文件

前言 pc浏览器和ios的浏览器都可以直接在线显示pdf文件&#xff0c;但是android浏览器不能在线预览pdf文件&#xff0c;如何预览pdf文件&#xff1f; Github: https://github.com/gjTool/pdfh5 Gitee: https://gitee.com/gjTool/pdfh5 使用pdfh5预览pdf 编写预览页面 <…...

编程日记 2023/9/5 12:36:49

Java智慧工地大数据中心源码

智慧工地技术架构&#xff1a;微服务JavaSpring Cloud VueUniApp MySql 智慧工地形成安全、质量、进度、人员、机械、绿色施工六大针对性解决方案。 安全管理 围绕重大危险源提供管控&#xff0c;可视化跟踪消防、安防、基坑、高支模、临边防护、卸料平台等设施设备的安全状态…...

编程日记 2023/9/5 12:35:48

关于人工智能的担忧

人工智能的快速发展引发了一系列关于其潜在风险和担忧的讨论。以下是一些常见的人们对人工智能的担忧&#xff1a; 失业问题&#xff1a;人工智能的出现可能会导致很多工作岗位的消失&#xff0c;特别是那些需要重复性劳动的工作。人们担心机器取代人类工作将导致大规模失业和社…...

编程日记 2023/9/5 12:34:47

JVM之强软弱虚引用

在Java虚拟机&#xff08;JVM&#xff09;中&#xff0c;有几种不同类型的引用&#xff0c;它们分别是&#xff1a;强引用&#xff08;Strong Reference&#xff09;、软引用&#xff08;Soft Reference&#xff09;、弱引用&#xff08;Weak Reference&#xff09;、虚引用&am…...

编程日记 2023/9/5 12:33:46

Python编程练习与解答 练习98：一个数是素数吗

质数是大于1的整数&#xff0c;它只能被1和它本身整除。编写一个函数&#xff0c;来确定他的参数是不是质数&#xff0c;如果是&#xff0c;则返回True&#xff0c;否则返回False。编写一个main程序&#xff0c;从用户那里读取一个整数并显示一条消息&#xff0c;指示它是不是质…...

编程日记 2023/9/5 12:32:42

vue3+ts+uniapp实现小程序端input获取焦点计算上推页面距离

vue3tsuniapp实现小程序端input获取焦点计算上推页面距离 input获取焦点计算上推页面距离 1.先说我这边的需求2.发现问题3.解决思路4.代码展示 自我记录 1.先说我这边的需求 需求 1.给键盘同级添加一个按钮例如’下一步’ or ‘确认’ 这种按钮 2.初步想法就是获取input焦点时…...

编程日记 2023/9/5 12:31:42

【2023集创赛】加速科技杯二等奖作品：基于ATE的电源芯片测试设计与性能分析

本文为2023年第七届全国大学生集成电路创新创业大赛&#xff08;“集创赛”&#xff09;加速科技杯二等奖作品分享&#xff0c;参加极术社区的【有奖征集】分享你的2023集创赛作品&#xff0c;秀出作品风采&#xff0c;分享2023集创赛作品扩大影响力&#xff0c;更有丰富电子礼…...

编程日记 2023/9/5 12:30:40

Java入坑之Robot类

一、概述 1.1Robot类概述 在Java中&#xff0c;Robot是一个属于java.awt包的类。它还扩展了 Object 类。该类用于为测试自动化、自运行演示以及需要控制鼠标和键盘的其他应用程序生成本机系统输入事件。换句话说&#xff0c;我们使用 Java Robot 类来触发输入事件&#xff0c;…...

编程日记 2023/9/5 12:29:39

spring-secrity的Filter顺序+自定义过滤器

Filter顺序 Spring Security的官方文档向我们提供了filter的顺序&#xff0c;实际应用中无论用到了哪些&#xff0c;整体的顺序是保持不变的: ChannelProcessingFilter&#xff0c;重定向到其他协议的过滤器。也就是说如果你访问的channel错了&#xff0c;那首先就会在channel…...

编程日记 2023/9/5 12:28:38

leetcode 371. 两整数之和

异或&#xff1a;不同为1&#xff0c;相同为0&#xff0c;刚好符合加法&#xff0c;但是缺少进位的可能 按位与&#xff1a;只有都为1才为1&#xff0c;否则都为0&#xff0c;如果两个数按位与再左移一位&#xff0c;就能代表所有要进位的位 class Solution {public int getS…...

编程日记 2023/9/5 12:27:37

Medium: Where to Define Qualified users in A/B testing?

1. Common AB Testing Setup Issue (Framework) 局限性: unqualified users will also be considered and mess up experimentation results....

编程日记 2023/9/5 12:26:36

POJ 3662 Telephone Lines 二分，最小化第k大的数

一、题目大意 我们有n个点&#xff0c;p条边&#xff0c;最小化从1到n之间的路径的第k1大的数&#xff08;当路径不超过k时就是0&#xff09; 二、解题思路 我们首先用dijkstra过一遍&#xff0c;判断从1能不能到n&#xff0c;不能直接输出-1结束。 1能到达n的话&#xff0…...

编程日记 2023/9/5 12:25:35

【mybatis-plus进阶】多租户场景中多数据源自定义来源dynamic-datasource实现

Springbootmybatis-plusdynamic-datasourceDruid 多租户场景中多数据源自定义来源dynamic-datasource实现 文章目录 Springbootmybatis-plusdynamic-datasourceDruid 多租户场景中多数据源自定义来源dynamic-datasource实现0.前言1. 作者提供了接口2. 基于此接口的抽象类实现自…...

编程日记 2023/9/5 12:24:34

vue3 async await

const getStruct async () > {//首先从store读取&#xff0c;否则通过接口获取if (store.state.struct.v ! null) {return store.state.struct.v;} else {const data await getStructApi();store.dispatch("struct/keepV", data).then(() > {console.log(&qu…...

编程日记 2023/9/5 12:23:33

CLion远程Linux开发环境搭建及找不到Linux头文件的解决方法

CLion远程开发环境搭建及找不到Linux头文件的解决方法 文章目录 CLion远程开发环境搭建及找不到Linux头文件的解决方法1.前言2.远程开发3.远程编译4.远程调试5.远程开发Linux头文件找不到&#xff08;比如pthread.h、<sys/socket.h>&#xff09;6.最后 1.前言 在某些时候…...

编程日记 2023/9/5 12:22:31

Python综合案例（基本地图使用）

一、基本地图的使用 基本代码&#xff1a; """ 演示地图可视化的基本使用 """ from pyecharts.charts import Map from pyecharts.options import VisualMapOpts# 准备地图对象 map Map() # 准备数据 data [("北京", 99),("…...

编程日记 2023/9/5 12:21:30

maven的scope总结

scope类型 compiletestprovidedruntimesystemimport compile 编译依赖范围。如果没有指定&#xff0c;就会默认使用该依赖范围。使用此依赖范围的Maven 依赖&#xff0c;对于编译、测试、运行三种classpath 都有效。大部分是这种&#xff0c;在编译、测试和运行的时候都需要使…...

编程日记 2023/9/5 12:20:29

Linux执行命令

命令格式 主命令 选项 参数&#xff08;操作对象&#xff09;例如&#xff1a; 修改主机名 hostname set-hostname 新名称显示/目录下的文件的详细信息 ls -l /命令 内置命令&#xff08;builtin&#xff09;&#xff1a;shell程序自带的命令。 外部命令&#xff1a;有独立…...

编程日记 2023/9/5 12:19:29

Nginx 配置中root和alias的区别分析

root和alias都可以定义在location模块中&#xff0c;都是用来指定请求资源的真实路径&#xff0c;比如&#xff1a; location /i/ { root /data/w3; } 请求 http://foofish.net/i/top.gif 这个地址时&#xff0c;那么在服务器里面对应的真正的资源 是 /data/w3/i/top.gif文…...

编程日记 2023/9/5 12:18:27

AP51656 PWM和线性调光 LED车灯电源驱动IC 兼容替代PT4115 PT4205

产品描述 AP51656是一款连续电感电流导通模式的降压恒流源 用于驱动一颗或多颗串联LED 输入电压范围从 5V 到 60V&#xff0c;输出电流 可达 1.5A 。根据不同的输入电压和 外部器件&#xff0c; 可以驱动高达数十瓦的 LED。 内置功率开关&#xff0c;采用高端电流采样设置 …...

编程日记 2023/9/5 12:17:26

反向工程与模型迁移：打造未来商品详情API的可持续创新体系

在电商行业蓬勃发展的当下&#xff0c;商品详情API作为连接电商平台与开发者、商家及用户的关键纽带&#xff0c;其重要性日益凸显。传统商品详情API主要聚焦于商品基本信息&#xff08;如名称、价格、库存等&#xff09;的获取与展示&#xff0c;已难以满足市场对个性化、智能…...

编程新知 2025/9/15 5:56:53

微服务商城-商品微服务

数据表 CREATE TABLE product (id bigint(20) UNSIGNED NOT NULL AUTO_INCREMENT COMMENT 商品id,cateid smallint(6) UNSIGNED NOT NULL DEFAULT 0 COMMENT 类别Id,name varchar(100) NOT NULL DEFAULT COMMENT 商品名称,subtitle varchar(200) NOT NULL DEFAULT COMMENT 商…...

编程新知 2025/12/9 4:34:53

《基于Apache Flink的流处理》笔记

思维导图 1-3 章 4-7章 8-11 章 参考资料 源码&#xff1a; https://github.com/streaming-with-flink 博客 https://flink.apache.org/bloghttps://www.ververica.com/blog 聚会及会议 https://flink-forward.orghttps://www.meetup.com/topics/apache-flink https://n…...

编程新知 2025/12/15 15:10:54

深入解析C++中的extern关键字：跨文件共享变量与函数的终极指南

&#x1f680; C extern 关键字深度解析&#xff1a;跨文件编程的终极指南 &#x1f4c5; 更新时间&#xff1a;2025年6月5日 &#x1f3f7;️ 标签&#xff1a;C | extern关键字 | 多文件编程 | 链接与声明 | 现代C 文章目录 前言&#x1f525;一、extern 是什么&#xff1f;&…...

编程新知 2025/12/15 2:27:36

mysql已经安装，但是通过rpm -q 没有找mysql相关的已安装包

文章目录 现象&#xff1a;mysql已经安装&#xff0c;但是通过rpm -q 没有找mysql相关的已安装包遇到 rpm 命令找不到已经安装的 MySQL 包时&#xff0c;可能是因为以下几个原因&#xff1a;1.MySQL 不是通过 RPM 包安装的2.RPM 数据库损坏3.使用了不同的包名或路径4.使用其他包…...

编程新知 2025/12/4 3:48:42

10-Oracle 23 ai Vector Search 概述和参数

一、Oracle AI Vector Search 概述 企业和个人都在尝试各种AI&#xff0c;使用客户端或是内部自己搭建集成大模型的终端&#xff0c;加速与大型语言模型&#xff08;LLM&#xff09;的结合&#xff0c;同时使用检索增强生成&#xff08;Retrieval Augmented Generation &#…...

编程新知 2025/12/10 23:35:18

Reasoning over Uncertain Text by Generative Large Language Models

https://ojs.aaai.org/index.php/AAAI/article/view/34674/36829https://ojs.aaai.org/index.php/AAAI/article/view/34674/36829 1. 概述 文本中的不确定性在许多语境中传达，从日常对话到特定领域的文档（例如医学文档）（Heritage 2013；Landmark、Gulbrandsen 和 Svenevei…...

编程新知 2025/12/12 4:15:39

在Ubuntu24上采用Wine打开SourceInsight

1. 安装wine sudo apt install wine 2. 安装32位库支持，SourceInsight是32位程序 sudo dpkg --add-architecture i386 sudo apt update sudo apt install wine32:i386 3. 验证安装 wine --version 4. 安装必要的字体和库（解决显示问题） sudo apt install fonts-wqy…...

编程新知 2025/10/14 0:47:25

20个超级好用的 CSS 动画库

分享 20 个最佳 CSS 动画库。 它们中的大多数将生成纯 CSS 代码&#xff0c;而不需要任何外部库。 1.Animate.css 一个开箱即用型的跨浏览器动画库&#xff0c;可供你在项目中使用。 2.Magic Animations CSS3 一组简单的动画&#xff0c;可以包含在你的网页或应用项目中。 3.An…...

编程新知 2025/12/10 1:29:00

深入浅出深度学习基础：从感知机到全连接神经网络的核心原理与应用

文章目录 前言一、感知机 (Perceptron)1.1 基础介绍1.1.1 感知机是什么&#xff1f;1.1.2 感知机的工作原理 1.2 感知机的简单应用&#xff1a;基本逻辑门1.2.1 逻辑与 (Logic AND)1.2.2 逻辑或 (Logic OR)1.2.3 逻辑与非 (Logic NAND) 1.3 感知机的实现1.3.1 简单实现 (基于阈…...

编程新知 2025/12/11 8:48:18