利用PDF.JS插件解决了本地pdf文件在线浏览问题(根据需要隐藏下载功能,只保留打印功能)
我是在IE11和谷歌上做的测试,都可以显示,把做出的东西记录下来,方便大家还有自己学习!
可以在IIS7服务器上也可以下载Tomcat来做服务器
Tomcat下载地址 http://pan.baidu.com/s/1dEEUFQD
根据百度经验安装和配置Tomcat http://jingyan.baidu.com/article/870c6fc33e62bcb03fe4be90.html
有关pdf.js的介绍在如下网址 https://github.com/mozilla/pdf.js
这里只需下载此文件即可 http://pan.baidu.com/s/1c2yXWwo
把generic拷贝到Tomcat的webapps中
启动Tomcat后,就可以通过在浏览器地址栏输入下列网址即可打开自带的demo:
http://localhost:8080/generic/web/viewer.html
调用pdf.js插件,将该插件放到页面的框架中,代码如下所示
html代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>pdf</title>
<link rel="stylesheet" type="text/css" href="main.css"/>
</head>
<body style="background:url(img/%E8%83%8C%E6%99%AF3.jpg)">
<center>
<div id="head">
</div>
<div id="main">
<div id="main_l">
<iframe name="myframe" src="http://localhost:8080/generic/web/viewer.html" width="886" height="990"></iframe>
</div>
<div id="main_r">
<h3><a href="http://localhost:8080/generic/web/viewer.html?file=pdf/1.pdf"target="myframe">pdf1</a></h3>
<h3><a href="http://localhost:8080/generic/web/viewer.html?file=pdf/2.pdf"target="myframe">pdf2</a></h3>
<h3><a href="http://localhost:8080/generic/web/viewer.html?file=pdf/3.pdf" target="myframe">pdf3</a></h3>
</div>
</div>
<div id="foot">
</div>
</body>
</html>
css代码
@charset "utf-8";
/* CSS Document */
#body{ background:url(img/%E8%83%8C%E6%99%AF3.jpg)}
#main{width:1500px; height:1090px; background:url(img/%E8%83%8C%E6%99%AF3.jpg); padding-top:0px;}
#main_r{width:600px; height:1090px; background:url(img/%E8%83%8C%E6%99%AF3.jpg); float:left}
#main_l{width:896px; height:996px; ; float:left; padding-top:2px; padding-left:2px; padding-bottom:2px; padding-right:2px; background:#000}
#head{ width:1500px; height:80px; background:url(img/%E8%83%8C%E6%99%AF3.jpg);}
#foot{ width:1500px; height:80px; background:url(img/%E8%83%8C%E6%99%AF3.jpg);}
调试效果如下图:
隐藏下载功能:
在viewer.html更改即可
更改之前
更改之后
即增加 style="visibility:hidden";就可隐藏下载功能。
(想要打开的本地文件必须放到tomcat的webapp路径中,而且如果文件名有汉字也会打不开文件,这个问题还有待解决!!)
利用PDF.JS插件解决了本地pdf文件在线浏览问题(根据需要隐藏下载功能,只保留打印功能)的更多相关文章
- pdf.js插件使用记录,在线打开pdf
天记录一个js库:pdf.js.主要是实现在线打开pdf功能.因为项目需求需要能在线查看pdf文档,所以就研究了一下这个控件. 有些人很好奇,在线打开pdf文档浏览器不是支持吗.是的你说的都是现代浏览 ...
- pdf.js如何跨域读取pdf文件?
今天,上线一个客户网站之后(使用的是广州新一代虚拟空间)发现在读取上传的pdf文件的时候读取错误,通过直接在浏览器输入文件地址的时候发现文件地址被重定向了(呵呵!),结果就是pdf文件源由本地直接变成 ...
- https://github.com/Lushenggang/show-pdf在线浏览pdf文件在线浏览pdf文件
在线浏览pdf文件 https://github.com/Lushenggang/show-pdf https://github.com/Lushenggang/show-pdf
- vue.js 如何加载本地json文件
在项目开发的过程中,因为无法和后台的数据做交互,所以我们可以自建一个假数据文件(如data.json)到项目文件夹中,这样我们就可以模仿后台的数据进行开发.但是,如何在一个vue.js 项目中引入本地 ...
- js 读取外部的本地json文件
Javascript 读取外部的本地json文件 方案1 运行本地web服务器,提供文件服务 方案2 1.data = '[{"name" : "Ashwin" ...
- 用 pdf.js兼容部分安卓显示PDF在线预览 时,a标签直接链接参数文件不能含中文的解决办法
例子: 项目部署在 Tomcat 上的: <a href="../generic/web/viewer.html?file=doc/register/要显示的文件.pdf" ...
- Python:爬取一个可下载的PDF链接并保存为本地pdf文件
问题:网页http://gk.chengdu.gov.cn/govInfo/detail.action?id=2653973&tn=2中有一个PDF需要下载,开发者模式下该PDF的链接为htt ...
- GIS技术在医疗行业的应用:利用切片地图发布技术解决dmetrix数字病理切片在线浏览
最近一直在研究切片地图发布技术,解决各种矢量和栅格数据的切片地图制作和发布问题.这块的技术在土地评估和调查类公司中应用较多,因为他们经常需要使用各地地图,传统的文件管理方式很难适应工作现状,如果将各种 ...
- webpack.config.js====插件purifycss-webpack,提炼css文件
1. 安装:打包编译时,可以删除一些html中没有使用的选择器,如果html页面中没有class=a class="b"的元素,.a{}.b{}样式不会加载 cnpm instal ...
随机推荐
- DM8168 unrecoverable error: OMX_ErrorBadParameter (0x80001005) [resolved]
DM8168 custom board 成功启动系统之后想先測一下8168编解码功能,把开发包里的examples跑一遍.启动完毕后.连上HDMI显示,在starting Matrix GUI app ...
- 笔记03 wpf 在MVVM模式下怎样在Viewmodel里面获得view的控件对象
转自http://blog.csdn.net/qing2005/article/details/6601199http://blog.csdn.net/qing2005/article/detail ...
- Swift的两个小窍门
一:查看Swift版本号(How do I see which version of Swift I’m using in Xcode?) 终端下输入:xcrun swift -version(in ...
- linux中vi编辑器(转载)
三种模式相互切换 在命令终端输入vi进入vi编辑器. 命令模式:进入编辑器即进入命令模式, 输入模式:在命令模式下输入“i ”进入输入模式: 末行模式:按“:”进入末行模式: 在输入模式切换至末行模式 ...
- 如何获取ipa 包的图片
突然想起当初刚学习iOS的时候,就经常通过抓包和提取素材的方式来模仿App,今天就教大家如何一步步提取App的素材! 大家是否有过想要获取别人的素材的想法?看到某些App的资源很不错,很想导出来用用, ...
- asp.net mvc4 之Webapi之应用客户端访问服务器端
一.说明 客户端项目类型设计为:winform(winform窗体项目类型) 服务器端项目类型设计为:asp.net mvc4 webapi 在这里分为项目运行和调试两种情况讨论: 运行: 这种情况 ...
- 九度OJ 1119:Integer Inquiry(整数相加) (大数运算)
时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:679 解决:357 题目描述: One of the first users of BIT's new supercomputer was ...
- Write Custom Java to Create LZO Files
https://cwiki.apache.org/confluence/display/Hive/LanguageManual+LZO LanguageManual LZO Skip to e ...
- react遇到的各种坑
标签里用到<label for>的,for 要写成htmlFor 标签里的class要写成className 组件首字母一定要大写 单标签最后一定要闭合 如果html里要空格转义, 注意不 ...
- 关于WordPress后台设置中的WordPress地址和站点地址的解读
今天我在TeachCourse博客中不小心把WordPress地 址和站点地址都改为了http://www.qgjie123.com,结果重新刷新TeachCourse博客页面的时候,页面排版错乱的情 ...