dong_k
/
zhapp


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
							<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="format-detection" content="telephone=no" />
	<meta name="msapplication-tap-highlight" content="no" />
	<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">
	<title>PDFH5</title>
	<link rel="stylesheet" href="css/style.css" />
	<link rel="stylesheet" href="css/pdfh5.css" />
	<link href="https://www.gjtool.cn/download/pdfh5.png" type="image/x-icon" rel="shortcut icon" />
	<style>
		html,
		body {
			width: 100%;
			height: 100%;
		}

		#demo {
			display: none;
			/* height: 33%; */
		}

		#demo2 {
			/* display: none; */
			height: 33%;
		}

		#demo3 {
			/* display: none; */
			height: 33%;
		}
	</style>
</head>

<body>
	<div id="app">
		<div class="text-wrapper">
			<div class="text part1">
				<div>
					<span class="letter">
						<div class="character">L</div> <span></span>
					</span>
					<span class="letter">
						<div class="character">o</div> <span></span>
					</span>
					<span class="letter">
						<div class="character">a</div> <span></span>
					</span>
					<span class="letter">
						<div class="character">d</div> <span></span>
					</span>
					<span class="letter">
						<div class="character">i</div> <span></span>
					</span>
					<span class="letter">
						<div class="character">n</div> <span></span>
					</span>
					<span class="letter">
						<div class="character">g</div> <span></span>
					</span>
				</div>
			</div>
			<div class="how-to"><span>正在加载中，请您耐心等待...</span></div>
		</div>

	</div>
	<div id="demo"></div>
	<script src="js/pdf.js"></script>
	<script src="js/pdf.worker.js"></script>
	<script src="js/jquery-3.6.0.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/pdfh5.js" type="text/javascript" charset="utf-8"></script>
	<script src="./vconsole.min.js"></script>
	<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
	<script type="text/javascript">
		var vConsole = new VConsole();
		console.log('Hello world');
		var pdfh5;
		$("#app").remove();
		$("#demo").show();
		pdfh5 = new Pdfh5('#demo', {
			pdfurl: "git.pdf",
			// renderType: "svg",
			// cMapUrl:"https://unpkg.com/pdfjs-dist@2.7.570/cmaps/",
			// responseType: "blob" // blob arraybuffer
		});
		pdfh5.on("complete", function (status, msg, time) {
			console.log("状态：" + status + "，总耗时：" + time + "毫秒，总页数：" + this.totalNum, msg);
		});
		// pdfh5.on("scroll", function (scrollTop, currentNum) {
		// 	console.log("scrollTop:"+scrollTop,"currentNum:"+currentNum);
		// });
		//配置项参数 renderType:"svg" 渲染模式为svg，默认canvas
		// var pdfh5 = new Pdfh5('#demo', {
		//     pdfurl: "./default.pdf",
		//     renderType:"svg"
		// });

		//配置项参数 URIenable:true 开启获取地址栏file参数，获取地址栏pdf路径?file=xxx.pdf，默认false不开启
		// var pdfh5 = new Pdfh5('#demo', {
		//     URIenable:false,
		//     pdfurl: "./default.pdf"
		// });

		//配置项参数 是否显示小部件 顶部绿色加载进度条loadingBar 左上角页码显示pageNum 右下角回到顶部按钮backTop  默认显示
		//		var pdfh5 = new Pdfh5('#demo', {
		// 			 loadingBar: false,
		//           pageNum:false,
		//           backTop:false
		// 		});

		//配置项参数data，文件流形式传入  pdfurl和data二选一
		//		var pdfh5 = new Pdfh5('#demo', {
		// 			data: data
		// 		});

		//配置项参数scrollEnable:false不允许pdf滚动,true允许pdf滚动  默认允许
		//		var pdfh5 = new Pdfh5('#demo', {
		// 			scrollEnable:false,//是否允许pdf滚动
		// 			pdfurl: url
		// 		});
		//pdfh5.scrollEnable(true)允许pdf滚动,pdfh5.scrollEnable(false)不允许pdf滚动

		//配置项参数zoomEnable:false不允许pdf手势缩放,true允许pdf手势缩放  默认允许
		//		var pdfh5 = new Pdfh5('#demo', {
		// 			zoomEnable:false,//是否允许pdf手势缩放
		// 			pdfurl: url
		// 		});

		//pdfh5还原、销毁（附带回调函数）：   pdfh5.reset pdfh5.destroy
		//pdfh5显示、隐藏（附带回调函数）：   pdfh5.show pdfh5.hide

		//pdf准备开始渲染，此时可以拿到pdf总页数
		// pdfh5.on("ready", function() {
		// 	console.log("pdf准备开始渲染，总页数：" + this.totalNum)
		// })

		//监听pdf渲染失败
		// pdfh5.on("error", function (time) {
		//     console.log("渲染失败，总耗时" + time + "毫秒")
		// })
		//监听完成事件，加载失败、渲染成功都会触发
		// pdfh5.on("complete", function(status, msg, time) {
		// 	console.log("状态：" + status + "，总耗时：" + time + "毫秒，总页数：" + this.totalNum, msg)
		// })

		//监听渲染中事件
		// pdfh5.on("render", function(currentNum, time, currentPageDom) {
		// 	// currentPageDom.append("<span class='name-logo'>张三</span>")
		// 	console.log("当前页码：" + currentNum)
		// })
		//on方法,监听事件： 开始初始化 init 准备渲染pdf ready 加载完成 complete 加载失败 error 加载成功 success 渲染pdf中 render
		// 缩放zoom   滚动scroll 显示show  隐藏hide 还原reset 销毁destroy  允许缩放zoomEnable 允许滚动scrollEnable

		//pdfh5支持在线预览
		//http://www.gjtool.cn/pdfh5/pdf.html?file=http://www.gjtool.cn/pdfh5/default.pdf
	</script>
</body>

</html>