pdfh5在线预览pdf文件

前言

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; */
}

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/115547.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【LeetCode-中等题】437. 路径总和 III

文章目录 题目方法一&#xff1a;迭代层序 每层节点dfs 维护一个count变量 题目 方法一&#xff1a;迭代层序 每层节点dfs 维护一个count变量 思路&#xff1a; 层序遍历每一个节点遍历一个节点就对这个节点进行dfsdfs的同时&#xff0c;维护一个count变量&#xff0c;并且…

2001-2021年中国城市分产业创新指数(574万+)

2001-2021年中国城市分产业创新指数&#xff08;574万&#xff09; 1、时间&#xff1a;2001-2021年 2、来源&#xff1a;中国城市和产业创新力报告 3、指标&#xff1a;包括城市创新指数、产业创新指数、城市-产业创新指数 4、整理方式&#xff1a; 整理方式是基于国家知…

基于Python的小区监控图像拼接系统设计与实现【源码+论文+演示视频+包运行成功】

博主介绍&#xff1a;✌csdn特邀作者、博客专家、java领域优质创作者、博客之星&#xff0c;擅长Java、微信小程序、Python、Android等技术&#xff0c;专注于Java、Python等技术领域和毕业项目实战✌ &#x1f345;文末获取源码联系&#x1f345; &#x1f447;&#x1f3fb; …

2023开学礼《乡村振兴战略下传统村落文化旅游设计》南京农大许少辉八一新书

2023开学礼《乡村振兴战略下传统村落文化旅游设计》南京农大许少辉八一新书

【教程分享】Docker搭建Zipkin,实现数据持久化到MySQL、ES

1 拉取镜像 指定版本&#xff0c;在git查看相应版本&#xff0c;参考&#xff1a; https://github.com/openzipkin/zipkin 如2.21.7 docker pull openzipkin/zipkin:2.21.7 2 启动 Zipkin默认端口为9411。启动时通过-e server.portxxxx设置指定端口 docker run --name zi…

最新社区团购电商小程序源码 无bug完美运营版+详细搭建部署教程

分享一个开源社区团购电商小程序源码&#xff0c;无bug完美运营版&#xff0c;含完整前后端详细搭建部署教程。 系统运营模式&#xff1a;整合线下社区资源&#xff0c;由各快递代收点、社区便利店、社区物业、业主等发起的社区微信群&#xff0c;推送商品信息&#xff0c;消费…

MYSQL(索引、事务)

文章目录 一、索引二、事务 一、索引 数据库中的表、数据、索引之间的关系&#xff0c;类似于书架上的图书、书籍内容和书籍目录的关系 1. 概述 概念&#xff1a;相当于是一本书的目录&#xff0c;是以‘列’为维度进行建立的使用场景&#xff1a;如果我们要查询一个表中的某个…

汽车自适应巡航系统车距控制策略研究

1 引言 自适应巡航控制( Adaptive Cruise Control&#xff0c;ACC) 是汽车驾驶辅助系统的重要组成部分&#xff0c;其作用是根据车距传感器探测到本车( ACC 车辆) 与主目标车辆( 前车) 之间的相对位置和相对速度信息&#xff0c;自动调节ACC 车辆的节气门开度或部分制动力矩( 即…

RT_Thread内核机制学习(一)

ARM架构及汇编 ARM芯片属于精简指令集计算机&#xff08;RISC&#xff1a;Reduced Instruction Set Computer&#xff09;&#xff0c;它所使用的指令比较简单&#xff0c;有如下特点&#xff1a; 对内存只有读、写指令。对于数据的运算实在CPU内部实现。使用RISC指令的CPU复杂…

CSC2121A

半桥架构的栅极驱动电路CSC2121A CSC2121系列是一款高性价比的半桥架构的栅极驱动专用电路&#xff0c;用于大功率MOS管、IGBT管栅极驱动。IC内部集成了逻辑信号处理电路、死区时间控制电路、欠压保护电路、电平位移电路、脉冲滤波电路及输出驱动电路&#xff0c;专用于无刷电…

MybatisPlus(2)

前言&#x1f36d; ❤️❤️❤️SSM专栏更新中&#xff0c;各位大佬觉得写得不错&#xff0c;支持一下&#xff0c;感谢了&#xff01;❤️❤️❤️ Spring Spring MVC MyBatis_冷兮雪的博客-CSDN博客 上篇我们简单介绍了MybatisPlus的方便之处&#xff0c;这篇来深入了解Myb…

LNMT架构

所谓的LNMT架构 指的就是Linux操作系统上部署Nginx web服务器、MySQL数据库服务器、Tomcat中间件服务器 L linux N nginx M mysql T tomcat 单机部署 1&#xff0c;安装 apache-tomcat 2&#xff0c;移动目录 3&#xff0c;复制第二个tomcat 4&#xff0c;…

大型商城系统功能逻辑架构_各大系统关系设计_OctShop

一个商城系统应该具备什么样的功能才算一个合格的网上商城呢&#xff0c;才能满意用户的下单支付&#xff0c;退款退货&#xff0c;售后等需求呢&#xff01; 商城一般分为三种角色&#xff1a;买家&#xff0c;商家&#xff0c;平台&#xff0c;这三种角色都有各自的功能特点。…

springMVC之拦截器

文章目录 前言一、拦截器的配置二、拦截器的三个抽象方法三、多个拦截器的执行顺序总结 前言 拦截器 一、拦截器的配置 SpringMVC中的拦截器用于拦截控制器方法的执行 SpringMVC中的拦截器需要实现HandlerInterceptor SpringMVC的拦截器必须在SpringMVC的配置文件中进行配置&…

Android之自定义时间选择弹框

文章目录 前言一、效果图二、实现步骤1.自定义Dialog2.xml布局3.背景白色转角drawable4.取消按钮背景drawable5.确定按钮背景drawable6.NumberPicker样式和弹框样式7.弹框动画8.Activity使用 总结 前言 随着产品人员不断变态下&#xff0c;总是会要求我们的界面高大上&#xf…

Java 多线程系列Ⅱ(线程安全)

线程安全 一、线程不安全线程不安全的原因&#xff1a; 二、线程不安全案例与解决方案1、修改共享资源synchronized 使用synchronized 特性 2、内存可见性Java内存模型&#xff08;JMM&#xff09;内存可见性问题 3、指令重排列4、synchronized 和 volatile5、拓展知识&#xf…

计算机毕设之基于Python+django+MySQL可视化的学习系统的设计与实现

系统阐述的是使用可视化的学习系统的设计与实现&#xff0c;对于Python、B/S结构、MySql进行了较为深入的学习与应用。主要针对系统的设计&#xff0c;描述&#xff0c;实现和分析与测试方面来表明开发的过程。开发中使用了 django框架和MySql数据库技术搭建系统的整体架构。利…

Git结合Gitee的企业开发模拟

本系列有两篇文章&#xff1a; 一是另外一篇《快速使用Git完整开发》&#xff0c;主要说明了关于Git工具的基础使用&#xff0c;包含三板斧&#xff08;git add、git commit、git push&#xff09;、Git基本配置、版本回退、分支管理、公钥与私钥、远端仓库和远端分支、忽略文…

迈向无限可能, ATEN宏正领跑设备切换行业革命!

随着互联网在各个领域的广泛应用,线上办公这一不受时间和地点制约、不受发展空间限制的办公模式开始广受追捧,预示着经济的发展正朝着新潮与活跃的方向不断跃进。当然,在互联网时代的背景下,多线程、多设备的线上办公模式也催生了许多问题:多设备间无法进行高速传输、切换;为保…