<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>浏览器打开PDF</title>

		<style type="text/css">

			.lightbox {

				position: fixed;

				top: 0px;

				left: 0px;

				height: 100%;

				width: 100%;

				z-index: 7;

				opacity: 0.3;

				display: block;

				background-color: rgb(0, 0, 0);

				display: none;

			}

			.pop,

			iframe {

				position: absolute;

				left: 50%;

				top: 0;

				width: 893px;

				height: 100%;

				margin-left: -446.5px;

				z-index: 9;

			}

		</style>

		<script src="pdf.js"></script>

		<script type="text/javascript">

			function showPdf(isShow) {

				var state = "";

				if(isShow) {

					state = "block";

				} else {

					state = "none";

				}

				var pop = document.getElementById("pop");

				pop.style.display = state;

				var lightbox = document.getElementById("lightbox");

				lightbox.style.display = state;

			}

			function close() {

				showPdf(false);

			}

		</script>

	</head>

	<body>

				<center><a href="introduce.pdf" target="pdfContainer" onclick="showPdf(true)">打开PDF</a></center>

		<div class="lightbox" id="lightbox"></div>

		<div id="pop" class="pop" style="display: none;">

			<a href="javascript:close()" style="

		    position: absolute;

		    right: -90px;

		    display: inline-block;

		    width: 80px;

		    height: 30px;font-size: 28px;font-weight: bold;color: black;top:150px;

		" id="close">关闭</a>

			<iframe src="" frameborder="0" id="pdfContainer" name="pdfContainer"></iframe>

		</div>

	</body>

</html>

　　

浏览器中打开PDF链接的更多相关文章

  1. [置顶] 如何在浏览器中打开PDF文件并实现预览的思路与代码

    编写项目遇到一个需要在浏览器中打开PDF文件的问题.最终实现效果如下: 其实也就是简单的在浏览器中实现一个打开pdf文件,并有类似预览功能的边框. 其实在网上经常见到类似的页面,在浏览器中打开pdf文 ...

  2. MVC自定定义扩展点之ActionNameSelectorAttribute+ActionFilterAttribute 在浏览器中打开pdf文档

    仅仅演示 了ASP.MVC 5 下为了在在浏览器中打开pdf文档的实现方式之一,借此理解下自定义ActionNameSelectorAttribute+ActionFilterAttribute 类的 ...

  3. SharePoint 2013在浏览器中打开pdf文档

    在没有安装Office Web Apps的情况下,SharePoint 2013是支持在IE上直接打开pdf和Excel文档的(只能查看,不能编辑,部分Excel会报错). 当然,需要现在管理中心做一 ...

  4. 微信下载app需要点击右上角在浏览器中打开下载的问题

    很多朋友是不是遇到过这样的问题,自家的app通过微信推广没办法直接下载,而是需要通过一个遮罩层来提示用户下载. 点击下载按钮提示点击右上角在浏览器中打开 这样的方式下载一个app是不是需要点击下载按钮 ...

  5. Android 通过URL scheme 实现点击浏览器中的URL链接，启动特定的App，并调转页面传递参数

    点击浏览器中的URL链接,启动特定的App. 首先做成HTML的页面,页面内容格式如下: <a href="[scheme]://[host]/[path]?[query]" ...

  6. 微信打开网址添加在浏览器中打开提示 http://caibaojian.com/weixin-tip.html

    原文链接:http://caibaojian.com/weixin-tip.html#t2 使用微信打开网址时,无法在微信内打开常用下载软件,手机APP等.网上流传的各种微信打开下载链接,微信已更新基 ...

  7. 浏览器中打开IOS应用并传参

    原创文章,转载请注明 开发中遇到这么一个问题,就是动态地指定联接服务器地址,或其它数据.如果是其它数据还好说一些,可以通过在服务器上获得的方式来弄.但如果服务器地址都需要动态指定的话.那就得另想办法了 ...

  8. web页在微信中访问增加遮罩层 右上角弹出在浏览器中打开

    https://blog.csdn.net/zgsdzczh/article/details/79744838 web页在微信中访问增加遮罩层 右上角弹出在浏览器中打开   <style typ ...

  9. js判断是否是在微信浏览器中打开

    // js判断是否是在微信浏览器中打开 function is_weixn(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/Mi ...

随机推荐

  1. netsh禁用启用本地连接

    netsh interface set interface mi8 disablednetsh interface set interface mi8 enabled mi8是本地连接名称,需要管理员 ...

  2. 无法加载协定为“NM3.IClrService”的终结点配置部分，因为找到了该协定的多个终结点配置。请按名称指示首选的终结点配置部分

    <binding name="NetTcpBinding_IClrService1" receiveTimeout="00:10:00" sendTime ...

  3. Linux基础命令---iostat显示设备状态

    iostat iostat指令用来显示cpu状态,系统IO设备的状态,以及相关磁盘和NFS使用状态.iostat命令通过观察设备相对于其平均传输速率的活动时间来监视系统输入/输出设备负载.iostat ...

  4. PHP中文转拼音

    网上大都讲的,都不支持繁体字,毕竟就是一个函数解决的事. 推荐一个很好的扩展,github地址: https://github.com/overtrue/pinyin 怎么用,自己去看就行了.

  5. newJob_newFell

    雄关漫道真如铁,而今迈步从头越. 不求闻达于诸侯,但求无愧于初心.

  6. 【js】js声明与数据类型

    之前整理知识点感觉有点没有针对性,每期知识点之间都没有关联,不成体系,其实对学习与运用知识并无益,随着知识的积累,不使用就会忘记.所以从本次开始,将对知识点进行体系化.先列出本期知识体系图,再进行逐步 ...

  7. [c/c++] programming之路（31）、位运算（二）

    一.取反的高级用法 #include<stdio.h> #include<stdlib.h> //取反的作用:末位清零 取反适用于各种位数不同的数据 void main0(){ ...

  8. 读Vue源码 （依赖收集与派发更新）

    vue的依赖收集是定义在defineReactive方法中,通过Object.defineProperty来设置getter,红字部分主要做依赖收集,先判断了Dep.target如果有的情况会执行红字 ...

  9. 【Django模板进阶007】

    本节主要讲 Django模板中的循环,条件判断,常用的标签,过滤器的使用 列表,字典,类的实例的使用 循环:迭代显示列表,字典等中的内容 条件判断:判断是否显示该内容,比如判断是手机访问,还是电脑访问 ...

  10. C# 调用Python库 最简单方法

    起个头,技术性文章应该言简意赅(因我看到外国回答问题都是可以一句代码解决的,绝不会写第二句),实现功能无误再贴出文章. 首先我不用 IronPython来写这个.py文件,因为我有Pycharm,而且 ...