h5合成海报

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

<div class="haibao" id="haibaoa">

   <section class="haibaotop" id="haibao">
       <img class="fe" src="{$pro_info['list_img']}" >
         <label class="fe1">1元惊喜</label>
   </section>
   
 </div>


<script>
        function convertHtmlToCanvas() {
            html2canvas(document.querySelector("#haibao"), {useCORS: true}).then(canvas => {
                document.getElementById('haibao').style.display = 'none'
                convertCanvasToImage(canvas)
            });
        }

        function convertCanvasToImage(canvas) {
            var image = new Image();
            image.className = 'img-responsive'
            image.src = canvas.toDataURL("image/jpeg", 0.92)
            // document.body.appendChild(image)
            document.getElementById("haibaoa").appendChild(image);
            let width = window.screen.width;
            let fixedw = 750;
            let scale = width / fixedw;
            $('.img-responsive').attr("style","width:"+ parseInt(scale*634)+"px;height:"+ parseInt(scale*858)+"px");
        }

        window.addEventListener('load', convertHtmlToCanvas)
    </script>