<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 -->

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

$("#pptx").pptxToHtml({

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

    slidesScale: "100%",

    slideMode: false,

    keyBoardShortCut: false

});

// 由于生成的html元素過大會(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);