H5截取当前网页

H5截取当前网页

ps:本人亲测,阿里云2核4G5M的服务器性价比很高,新用户一块多一天,老用户三块多一天,最高可以买三年,感兴趣的可以戳一下:阿里云折扣服务器

使用html2canvas工具,之后加入JS代码
<script  type="text/javascript" >

            //生成截图
            $(document).ready( function(){
                $("#div2_2").on("click", function(event) { //这里是点击事件按钮
                    event.preventDefault();
                    html2canvas(document.getElementById("div1"), {//这里是要截图的DIV
                        allowTaint: true,
                        taintTest: false,
                        onrendered: function(canvas) {
                            canvas.id = "mycanvas";
                            //document.body.appendChild(canvas);
                            //生成base64图片数据
                            var dataUrl = canvas.toDataURL();
                            var newImg = document.createElement("img");
                            newImg.src =  dataUrl;
                            document.body.appendChild(newImg);
                            window.open(newImg.src);
                        }
                    });
                });

            });

        </script>


注意事项:有的浏览器不支持或者不能理解z-index,所以不要使用z-index,关于absolute布局,因为是已经脱离了html的DOM流,所以,同一div中的absolute层,谁在DOM(文档流)的前面,谁就会出现在屏幕的下层,同理,谁在后面写,谁在上层
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值