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

pdfh5在线预览pdf文件

news 2026/2/9 13:05:23

前言

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

在软件开发中正确使用MySQL日期时间类型的深度解析

在日常软件开发场景中&#xff0c;时间信息的存储是底层且核心的需求。从金融交易的精确记账时间、用户操作的行为日志&#xff0c;到供应链系统的物流节点时间戳&#xff0c;时间数据的准确性直接决定业务逻辑的可靠性。MySQL作为主流关系型数据库&#xff0c;其日期时间类型的…...

编程新知 2025/10/16 13:22:06

Android Wi-Fi 连接失败日志分析

1. Android wifi 关键日志总结 (1) Wi-Fi 断开 (CTRL-EVENT-DISCONNECTED reason3) 日志相关部分&#xff1a; 06-05 10:48:40.987 943 943 I wpa_supplicant: wlan0: CTRL-EVENT-DISCONNECTED bssid44:9b:c1:57:a8:90 reason3 locally_generated1解析&#xff1a; CTR…...

编程新知 2025/9/14 19:44:52

论文解读：交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架（二）

HoST框架核心实现方法详解 - 论文深度解读（第二部分） 《Learning Humanoid Standing-up Control across Diverse Postures》 系列文章： 论文深度解读 + 算法与代码分析（二） 作者机构： 上海AI Lab, 上海交通大学, 香港大学, 浙江大学, 香港中文大学 论文主题： 人形机器人…...

编程新知 2026/2/9 0:12:12

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

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

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

HBuilderX安装（uni-app和小程序开发）

下载HBuilderX 访问官方网站&#xff1a;https://www.dcloud.io/hbuilderx.html 根据您的操作系统选择合适版本&#xff1a; Windows版&#xff08;推荐下载标准版&#xff09; Windows系统安装步骤 运行安装程序&#xff1a; 双击下载的.exe安装文件 如果出现安全提示&…...

编程新知 2026/1/31 12:52:04

拉力测试cuda pytorch 把 4070显卡拉满

import torch import timedef stress_test_gpu(matrix_size16384, duration300):"""对GPU进行压力测试&#xff0c;通过持续的矩阵乘法来最大化GPU利用率参数:matrix_size: 矩阵维度大小&#xff0c;增大可提高计算复杂度duration: 测试持续时间&#xff08;秒&…...

编程新知 2025/12/7 12:35:20

OPenCV CUDA模块图像处理-----对图像执行 均值漂移滤波（Mean Shift Filtering）函数meanShiftFiltering()

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 在 GPU 上对图像执行 均值漂移滤波&#xff08;Mean Shift Filtering&#xff09;&#xff0c;用于图像分割或平滑处理。 该函数将输入图像中的…...

编程新知 2026/1/20 12:53:30

AI书签管理工具开发全记录（十九）：嵌入资源处理

1.前言 &#x1f4dd; 在上一篇文章中&#xff0c;我们完成了书签的导入导出功能。本篇文章我们研究如何处理嵌入资源&#xff0c;方便后续将资源打包到一个可执行文件中。 2.embed介绍 &#x1f3af; Go 1.16 引入了革命性的 embed 包&#xff0c;彻底改变了静态资源管理的…...

编程新知 2026/1/30 16:24:23

以光量子为例，详解量子获取方式

光量子技术获取量子比特可在室温下进行。该方式有望通过与名为硅光子学&#xff08;silicon photonics&#xff09;的光波导&#xff08;optical waveguide&#xff09;芯片制造技术和光纤等光通信技术相结合来实现量子计算机。量子力学中&#xff0c;光既是波又是粒子。光子本…...

编程新知 2026/2/7 11:51:32

DBLP数据库是什么？

DBLP&#xff08;Digital Bibliography & Library Project&#xff09;Computer Science Bibliography是全球著名的计算机科学出版物的开放书目数据库。DBLP所收录的期刊和会议论文质量较高&#xff0c;数据库文献更新速度很快&#xff0c;很好地反映了国际计算机科学学术研…...

编程新知 2026/2/4 20:54:56