门户网站定义,免费的h5制作网站,做移动网站设计,wordpress转换为html前言
pc浏览器和ios的浏览器都可以直接在线显示pdf文件#xff0c;但是android浏览器不能在线预览pdf文件#xff0c;如何预览pdf文件#xff1f;
Github: https://github.com/gjTool/pdfh5 Gitee: https://gitee.com/gjTool/pdfh5
使用pdfh5预览pdf
编写预览页面
…前言
pc浏览器和ios的浏览器都可以直接在线显示pdf文件但是android浏览器不能在线预览pdf文件如何预览pdf文件
Github: https://github.com/gjTool/pdfh5 Gitee: https://gitee.com/gjTool/pdfh5
使用pdfh5预览pdf
编写预览页面
html
headmeta charsetUTF-8titlepdfh5预览/titlelink relstylesheet hrefpdfh5/css/pdfh5.css/link relstylesheet hrefpdfh5/css/style.css/style typetext/css/style
/head
body
div iddemo/div
/body
script srcpdfh5/js/pdf.js typetext/javascript charsetutf-8/script
script srcpdfh5/js/pdf.worker.js typetext/javascript charsetutf-8/script
script srcpdfh5/js/jquery-3.6.0.min.js typetext/javascript charsetutf-8/script
script srcpdfh5/js/pdfh5.js typetext/javascript charsetutf-8/script
scriptvar pdfh5 new Pdfh5(#demo, {pdfurl: ./default.pdf //可以是你的pdf链接地址/xxx/xxx.pdf});
/script
/html下载需要用到的css和js文件 https://github.com/gjTool/pdfh5 请见Git仓库中寻找 访问网页测试
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; */
}