欧美成人精品手机在线观看_69视频国产_动漫精品第一页_日韩中文字幕网 - 日本欧美一区二区

LOGO OA教程 ERP教程 模切知識(shí)交流 PMS教程 CRM教程 開發(fā)文檔 其他文檔  
 
網(wǎng)站管理員

【JavaScript】Vue純JS實(shí)現(xiàn)Office的pptx文件在線預(yù)覽

admin
2023年5月26日 18:42 本文熱度 2361

PPTX在線預(yù)覽,使用jquery的插件《PPTXjs》,純前端實(shí)現(xiàn)pptx轉(zhuǎn)html進(jìn)行展示。


1.在PPTXjs官網(wǎng)下載最新版插件,或者下載下面版本插件,并在index.html內(nèi)引入:

附件:PPTXjs-1.21.1.zip

<link rel="stylesheet" href="/PPTXjs/css/pptxjs.css">

<link rel="stylesheet" href="/PPTXjs/css/nv.d3.min.css"> <!-- for charts graphs -->

<script type="text/javascript" src="/PPTXjs/js/jquery-1.11.3.min.js"></script>

<script type="text/javascript" src="/PPTXjs/js/jszip.min.js"></script> <!-- v2.. , NOT v.3.. -->

<script type="text/javascript" src="/PPTXjs/js/filereader.js"></script> <!--https://github.com/meshesha/filereader.js -->

<script type="text/javascript" src="/PPTXjs/js/d3.min.js"></script> <!-- for charts graphs -->

<script type="text/javascript" src="/PPTXjs/js/nv.d3.min.js"></script> <!-- for charts graphs -->

<script type="text/javascript" src="/PPTXjs/js/pptxjs.js"></script>

<script type="text/javascript" src="/PPTXjs/js/divs2slides.js"></script> <!-- for slide show -->


2.html代碼

<div id="pptx"></div>


3.js代碼

$("#pptx").pptxToHtml({

    pptxFileUrl: "Sample_12.pptx", //pptx文件地址

    slidesScale: "100%",

    slideMode: false,

    keyBoardShortCut: false

});


4.如果是移動(dòng)端項(xiàng)目,需要把div縮放,否則生成的html元素過(guò)大會(huì)溢出屏幕(PC端可忽略此步驟)

// 由于生成的html元素過(guò)大會(huì)溢出,這里用定時(shí)器檢測(cè)元素生成完畢后進(jìn)行縮放顯示

let timer = setInterval(() => {

    const $slides = $(".slides");

    if ($slides.children().length) {

      const slidesWidth = Math.max(...Array.from($slides.children()).map((s) => s.offsetWidth))

      const $wrapper = $('#pptx');

      const wrapperWidth = $wrapper[0].offsetWidth;

      $wrapper.css({

        transform: `scale(${wrapperWidth / slidesWidth})`,

        "transform-origin": "top left",

      })

      clearInterval(timer)

    }

}, 100);


5.運(yùn)行代碼即可預(yù)覽。


該文章在 2023/5/26 18:59:53 編輯過(guò)
關(guān)鍵字查詢
相關(guān)文章
正在查詢...
點(diǎn)晴ERP是一款針對(duì)中小制造業(yè)的專業(yè)生產(chǎn)管理軟件系統(tǒng),系統(tǒng)成熟度和易用性得到了國(guó)內(nèi)大量中小企業(yè)的青睞。
點(diǎn)晴PMS碼頭管理系統(tǒng)主要針對(duì)港口碼頭集裝箱與散貨日常運(yùn)作、調(diào)度、堆場(chǎng)、車隊(duì)、財(cái)務(wù)費(fèi)用、相關(guān)報(bào)表等業(yè)務(wù)管理,結(jié)合碼頭的業(yè)務(wù)特點(diǎn),圍繞調(diào)度、堆場(chǎng)作業(yè)而開發(fā)的。集技術(shù)的先進(jìn)性、管理的有效性于一體,是物流碼頭及其他港口類企業(yè)的高效ERP管理信息系統(tǒng)。
點(diǎn)晴WMS倉(cāng)儲(chǔ)管理系統(tǒng)提供了貨物產(chǎn)品管理,銷售管理,采購(gòu)管理,倉(cāng)儲(chǔ)管理,倉(cāng)庫(kù)管理,保質(zhì)期管理,貨位管理,庫(kù)位管理,生產(chǎn)管理,WMS管理系統(tǒng),標(biāo)簽打印,條形碼,二維碼管理,批號(hào)管理軟件。
點(diǎn)晴免費(fèi)OA是一款軟件和通用服務(wù)都免費(fèi),不限功能、不限時(shí)間、不限用戶的免費(fèi)OA協(xié)同辦公管理系統(tǒng)。
Copyright 2010-2025 ClickSun All Rights Reserved