前端
文章平均质量分 77
只看远方
这个作者很懒,什么都没留下…
展开
-
pdf.js 入门使用指南1-安装篇
最近由于工作需要,需要一个功能在线浏览pdf。经过初步筛选,选定了pdf.js.可以满足我们所有的功能需求。一:先简要概括一下优缺点 优点总结:免费,开源的。这点很重要纯js实现,客户不需要安装额外的插件功能强大,缩放,打印,查找功能应有尽有兼容主流浏览器,火狐,谷歌,ie9+都支持 缺点总结 1:js 文件偏大,加载一起3m 多,即便压缩后,两个核心js 文件也在1m左右。会影响原创 2018-01-03 21:50:28 · 24878 阅读 · 12 评论 -
pdf.js分片下载的介绍1-什么是分片下载
前面写了几篇文字,有网友问什么是分片下载,以及需要怎么的设置等?其实我了解的也不是非常下详细,先在本片文章中介绍几个要点第一:分片下载主要适用那一些资源适合pdf、mp3、大图片等体积较大的附件第二:分片下载不是万能,需要依赖客户端和服务器浏览器需要支持,这里强调的是ie 浏览器,低版本的可能不支持。ie9以下好像不支持。我测试下来,谷歌浏览器支持的最好。后面我写文章单独描述。需要w...原创 2018-11-24 00:07:43 · 3708 阅读 · 5 评论 -
pdf.js 连续分页展示pdf内容
如何使用pdf.js 将所有内容在同一页中展示。本文将作出相应的展示,这类需求一般适用于手机,pad 等移动端。前面博客中,演示的内容。都是点击下一页进行翻页。后面有网友问,如何在一页中展示出来,所以我把这块补充上。其实呢,只要知道展示一页,如果要展示多个页,核心就是增加个循环,创建canvas 对象接受每一页的pdf文件绘制。其他的流程和每页显示一篇pdf,在流程上是一样的。 1:循环...原创 2018-07-29 23:24:45 · 16035 阅读 · 0 评论 -
如何禁用谷歌浏览器的自动填充
当网页中表单中,如果有密码箱。谷歌浏览器的密码填充机制就会启动,会对页面样式造成一定的影响。 1:如下图,密码会自动补充上,底色会变色 2:其实我们想要达到的效果是 3:关键是他填充的密码,是系统的登录密码,和这块的密码风马牛不相及。4:经过网络搜索,一般思路是<input type='text' onfocus="this.type=password&am原创 2018-05-22 16:06:58 · 19389 阅读 · 0 评论 -
pdf.js 入门使用指南4-手机端浏览pdf(touch.js)
经过测试,使用pdf.js这个开源库,自己编写代码实现pdf 文件浏览也不是很复杂。参照我以前的blog文章,如果要实现上一页,下一页,旋转等都非常简单。 但是,手机端是个比较依赖手势特殊存在。如果要实现如下功能: 1:双指放大,通过捏合双指进行放大或缩小 2:单个手指移动,放大后,通过胆汁移动,查问pdf指定的区域 3:左右滑动分页,比如左滑上一页,右滑下一页。如果...原创 2018-05-21 14:20:43 · 9075 阅读 · 4 评论 -
pdf.js实现旋转放大缩小
通过设置 getViewport 函数的scale 参数,可以设置控制放大和缩小比例 1:函数定义 通过查看源码,这个函数有两个参数 1.1 :scale 小数型,1.0 表示100%,0.5 ,表示缩放50% 1.2 roate ,旋转1.2 代码测试,page.getViewport(0.8),显示如下图所示 1.3 代码测试,page.getViewport(1....原创 2018-04-28 16:27:28 · 22681 阅读 · 4 评论 -
如果提高pdf.js加载速度之一分片下载
pdf.js 功能非常强大,但是如果pdf 文件比较大, 往往会加载比较慢。影响用户体验。问题提出: 如果 一个pdf 文件大小为:100M,如何快速的在浏览器打开难点分析: 我和同事初期分析是,pdf 需要先完整下载下来,然后再进行显示,会非常的慢。针对上面问题,这两天我进行了一些研究。总结如下: 1:pdf.js 有流媒体属性。简单的说,就是只要web服务器支持,浏览...原创 2018-04-10 16:54:14 · 24434 阅读 · 39 评论 -
使用js还原浏览器的缩放
移动端,使用手机浏览器打开一个网页,双指可以进行网页的缩放,非常方便1:缩放前 2:缩放后 3:有没有一种方法,可以还原到原始状态呢。 目前发现一种方法,动态修改viewport,head 中增加标签 <meta name="viewport" id="view1" content="width=device-width, initial-scale...原创 2018-03-13 16:32:09 · 10664 阅读 · 5 评论 -
pdf.js 入门使用指南3-字体显示问题
1:乱码问题。最近遇到一个问题,一个pdf 文件使用了冷门的字体,导致出现乱码,字体空白,如下图所示2:问题排查,初步排查,治标。 修改改pdf 文件,把字体都修改成宋体。再次预览,显示正常 。 3:从问题上根治这个问题,治本 总不能把每个pdf 都修改一下字体,这样太麻烦。经过测试,找到治本的方法。 下载 http://downloa原创 2018-01-17 16:27:42 · 17244 阅读 · 5 评论 -
pdf.js 入门使用指南2-显示篇
一:如何控制pdf缩放 var viewport = page.getViewport(scale); 参数:scale,0到1之间的小数,比如0.8,比如100%显示,填写1,参考如下 var viewport = page.getViewport(1);部分代码参考: var pdfDoc = null, pageNum = 1, pageRendering原创 2018-01-17 00:10:29 · 15751 阅读 · 5 评论 -
分享一个好用的图片压缩软件
为了性能优化需要,一般需要优化网站上的图片,减少大小。但问题来了,很多压缩软件是有损压缩,压缩后图片质量惨不忍睹。 下面我分享一下刚刚了解到的图片压缩软件,名字叫智图。 官网地址是: http://zhitu.isux.us/ 页面截图 如下,我感觉最大的有点是,压缩后图片不会太失真。即便是最低的质量,图片也是能用的。原创 2017-12-26 15:35:13 · 4699 阅读 · 0 评论 -
pd.fjs分片下载的介绍2:分片下载demo
上一个章节,简要说了以下分片下载的几个特性,研究的不够深入。今天主要用示例说明一下pdf.js分片下载。服务器环境: php7.2 nginx 1.14 ubuntu 18.04测试浏览器:谷歌浏览器 70.0.3538.110(第一个场景,直接使用pdf 文件1.1 代码如下:注意路径使用的是pdf 文件的物理路径$filePath = ‘…/doc/big.p...原创 2018-11-28 00:57:22 · 3227 阅读 · 8 评论