修改iframe生成的pdf的比例

原创 已于 2023-11-07 11:12:07 修改 · 1.3k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#pdf

于 2023-11-07 10:39:51 首次发布
本文介绍了如何通过在iframe链接后添加`#zoom=50`来设置嵌入PDF文档的显示比例，参数50是可自定义的，用于控制页面缩放。

如图想要设置这里的默认比例

在iframe连接后面加上#zoom=50即可，50是可以随便设置的，设置多少就是多少比例

 <iframe src="name.pdf#zoom=50" height="100%" width="100%"></iframe>

Hero_rong
关注
【Rust在WASM中实现pdf文件的生成】
wjcroom的专栏
12-01 1753
使用rust生成一个wasm将一个图片插入pdf。并在web端iframe显示这个pdf。 用到了web_sys, 操作页面元素, dataurl,取和生成blod内容的url. 还有,bingen.交互js的alert还有rust的greet, 的rust里使用alert. 在cosole,使用greet. 最终目的当页面存为图片后,图片转为pdf,并提供了源码,只能使用一页.
零散专题32 生成PDF
多啦的博客
06-13 837
生成pdf的方案 （1）JSPDF(前端生成 ) 优点：不需要服务端安装无头浏览器，使用CSS方便控制样式，生成的PDF文字可复制 缺点：对中文支持不好 （2）PDFKit( 服务端生成) 优点：服务端直接解决，生成的PDF文字可复制，通过引入字体，可支持中文 缺点：样式控制复杂 （3）node-html-pdf(服务端生成) 优点：服务端通过控制HTML模板生成PDF，支持中文，样式控...
iframe高度自适应.pdf
12-08
iframe高度自适应.pdf
iframe 动态加载pdf预览 且自动适应页面大小
zolty
04-14 8748
1.在网页加上按钮引导进入子页面 <li> <a class="J_menuItem" href="pdf.html?pdfname=pdf/1.1.pdf">1.1</a> </li> 用 ？ XXX= aaaa 来传递参数 XXX 2.用getQueryVariable函数，获取参数 function getQuer...
让iframe的高度height也可以设置百分比数值
Jinn Guo - Oracle ERP Consulting
03-03 7148
如果直接设置iframe这个标签的高度为百分数值，在ie6上有效果，但在ff上就不行。为了实现在ie和ff上效果一样。可以这样来实现：代码：                        只要将iframe放到表格的单元格里，就可以设置单元格的高度百分比和iframe的高度百分比去实现你的需求。还要加入html,body{height:100%}  
iframe嵌套PDF文件配置
weixin_61978391的博客
09-19 2204
1.首选获取到的url地址要进行oss 加密链接（后端有专门加密的接口）1.1设置默认缩放比例： 在地址栏后面拼接 "#zoom=200"1.5 默认侧边栏工具栏处于关闭状态 navpanes=0。2.加密后通过获取到的加密url获取pdf预览地址。1.3隐藏头部工具栏 ： toolbar=0。后端返回一段url地址，用pdf的形式打开。有些PDF形式打开的文件需要一些默认的配置。3.用iframe将url嵌套进去。
vue中利用iframe将html中内容导出成pdf
morningttt的博客
06-20 927
1、创建中填充需要打印的具体内容。创建用于打印时盛放内容。2、打印时获取ref="contentToPrint"的div中的内容；3、将待打印内容填充到iframe;4、调用iframe的打印方法打印。导出时，页面会显示此预览弹窗。
iframe全屏展示pdf
qq_40576178的博客
04-02 6979
使用iframe显示pdf时，默认会根据浏览器自适应，如果想实现让pdf沾满整个容器宽度，需要设置以下属性 <iframe width="100%" :src="PDFsrc+'#view=FitH,top'" frameborder="0" style="width: 100%; height: 100%"></iframe> 在src路径后面添加#view=FitH,top 默认是自适应，也可手动添加#view=Fit ...
iframe显示pdf
qq_45018817的博客
07-09 1039
标签嵌入PDF文件时，可以通过在URL中添加参数来控制PDF的显示行为，如缩放、页面导航、查看模式等。这些参数可以帮助你更好地控制PDF在。中的显示方式，提升用户体验。
iframe内容生成图片
08-26
- *2* [html2canvas生成pdf(html高度自适应带iframe)](https://download.youkuaiyun.com/download/c1052981766/10913007)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_...
pdf-iframe.zip
08-31
手头的项目有这样一个需求，审核报告开发，左侧是PDF，右侧是审核的辅助信息。 解决方案： a 写一个总的iframe，分为两个小iframe； b 利用itext生成所需要的报告并把绝对路径赋值到pdfTumor.jsp； c 调用controller里的pdf方法把数据传输到页面展示。
iframe标签实现pdf预览功能
05-29
iframe标签实现pdf预览功能
iframe的各项参数整理附说明及使用示例
09-28
由于iframe的参数比较多，本文整理了一些比较常用的参数并附有说明及使用示例，个人感觉还是比较全的，感兴趣的朋友可以参考下
vue中，怎么使用原生对iframe引入的PDF文件进行缩放
最新发布
07-16
在 Vue 中，通过 `computed` 属性动态生成 `iframe` 的 `src`，确保每次缩放比例变化时都会重新加载 PDF 并应用新的缩放设置[^1]。 - **性能优化建议** 频繁修改 `iframe` 的 `src` 可能会导致 PDF 重新加载，...
试用Foxit PDF: 在网页中单页展示PDF
半吊子伯爵的博客
09-29 1099
网站只是用插件单页展示PDF文件，功能简单，在官网提供的插件包里也有只渲染单页的示例代码，稍加改动后即可使用，但实施过程中发现有许多坑，于是想找官方文档，费了好一番功夫才找到一个中文文档，但发现里面也没有详细的参数配置说明，所以只能自行摸索。在控制台可以看到PDF的尺寸闪烁是因为每次翻页时都会重新计算宽度，而当某次因为某些原因产生滚动条后，滚动条会压缩网页的有效宽度，那么下次翻页时计算的宽度就会偏小，于是又会出现间隙（如图所示，间隙大约8px，默认的滚动条宽16px，所以大体可以猜到原因）。
前端预览PDF总结：iframe、embed、PDFObject、PDF.js
热门推荐
ruanhongbiao的专栏
05-09 9万+
要在网页上显示PDF文件,首先< object >、< embed >、< iframe >这几个标签就能实现PDF文件的预览（无需JavaScript支持），我还在网上看了下发现挺多第三方js库可以实现PDF预览，如jQuery Document Viewer、jquery.media.js、PDFObject、PDF.js等等。我大概看了下PDFObject...
pdf在iframe页面中的使用
十年代码深耕者，从 0 到 1 构建过无数技术蓝图。在这里，用实战经验为你剖析技术难点，用代码智慧点亮编程之路。无论是技术问题探讨，还是职业发展交流，随时欢迎来聊！
01-22 3346
实际项目中可能用到的操作有：放大两倍 隐藏工具栏 隐藏滚动条等配置。
如何把HTML页面（带Iframe）页面转化成mht或pdf格式的文件？
web_houzhanguo的博客
12-02 3230
Iframe遇到的坑如何把HTML页面（带Iframe）页面转化成pdf格式的文件？下载依赖文件需要输出的网页此图为iframe加载的图片pdf生成生成结果重要代码：注意：网页源码 如何把HTML页面（带Iframe）页面转化成pdf格式的文件？ 下载依赖文件 <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.debug.js"></script> <script src="https
iframe嵌套页面
Marble Race
04-03 6153
iframe嵌套页面方法 <body style="margin:0px;"> <iframe src="" width="100%" height="100%" frameborder="0" ></iframe> </body> iframe常用属性: frameborder:是否显示边框，1(yes),0(no) height:框架作为...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值