word、ppt文档新增图片预览模式

This commit is contained in:
陈精华
2019-04-25 18:39:58 +08:00
committed by kl
parent 68aa5db66b
commit b4d3419797
20 changed files with 312 additions and 5 deletions

View File

@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>office图片预览</title>
<script src="js/lazyload.js"></script>
<style>
.container{
width:100%;
}
.img-area{
text-align: center
}
</style>
</head>
<body>
<div class="container">
<#list imgurls as img>
<div class="img-area">
<img class="my-photo" alt="loading" data-src="${img}" src="images/loading.gif">
</div>
</#list>
</div>
<img src="images/left.png" style="position: fixed; cursor: pointer; top: 40%; left: 50px; z-index: 999;" alt="PDF预览" onclick="goForPdf()"/>
<script>
window.onload=checkImgs;
window.onscroll = throttle(checkImgs);
function goForPdf() {
var url = window.location.href;
if (url.indexOf("officePreviewType=image") != -1) {
url = url.replace("officePreviewType=image", "officePreviewType=pdf");
} else {
url = url + "&officePreviewType=pdf";
}
window.location.href=url;
}
</script>
</body>
</html>

View File

@ -17,6 +17,9 @@
<#assign finalUrl="${baseUrl}${pdfUrl}">
</#if>
<iframe src="/pdfjs/web/viewer.html?file=${finalUrl}" width="100%" frameborder="0"></iframe>
<img src="images/right.png" style="position: fixed; cursor: pointer; top: 40%; right: 50px; z-index: 999;" alt="图片预览" onclick="goForImage()"/>
</body>
<script type="text/javascript">
document.getElementsByTagName('iframe')[0].height = document.documentElement.clientHeight-10;
@ -27,5 +30,15 @@
var fm = document.getElementsByTagName("iframe")[0];
fm.height = window.document.documentElement.clientHeight-10;
}
function goForImage() {
var url = window.location.href;
if (url.indexOf("officePreviewType=pdf") != -1) {
url = url.replace("officePreviewType=pdf", "officePreviewType=image");
} else {
url = url + "&officePreviewType=image";
}
window.location.href=url;
}
</script>
</html>