Saltar al contenido

convertir div a imagen y descargar código jquery ejemplo

Contamos con el resultado a esta dificultad, o por lo menos eso pensamos. Si sigues con dudas deja tu comentario, que sin dudarlo te ayudaremos

Ejemplo: convertir div a imagen y descargar jquery

<html><head><scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">script><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js">script>head><bodystyle="border:1px solid #808080;width:550px;height:350px"><divid="html-content-holder"style="background-color:#F0F0F1;color:#00cc65;width:500px;padding-left:25px;padding-top:10px;"><strong>infinetsoft tutorialsstrong><hr/><h3style="color:#3e4b51;">convert html tocanvas         h3><pstyle="color:#3e4b51;">            Lorem ipsum dolor sit amet,consectetur adipiscing elit. In scelerisque egestas leo, vel congue maurismattis in. Curabitur quis massa ut metus interdum vehicula in vel massa. Nam miquam, venenatis sit amet libero at, vehicula rutrum nisi. In at aliquam metus.Class aptent taciti sociosqu ad litora torquent per conubia nostra, perinceptos himenaeos. Praesent eget quam laoreet, consequat lacus eget,condimentum neque. Aenean ut vehicula mi, et dictum quam. Integer elementumerat vel sagittis faucibus. Aliquam aliquam, ante et iaculis facilisis, nequeelit tempus neque, et lobortis urna velit porttitor nunc. In rutrum mi sit ametneque porta scelerisque. Pellentesque elementum sapien posuere arcu tinciduntornare. Nullam sed hendrerit nisl. Suspendisse at eros augue. Curabitur tempora lacus nec cursus.        p>div><aid="btn-Convert-Html2Image"href="#">convertto imagea><script>$(document).ready(function()var element =$("#html-content-holder");// global variable            var getCanvas; //global variable            html2canvas(element,                 onrendered: function (canvas)                     getCanvas = canvas;                            );             $("#btn-Convert-Html2Image").on('click', function ()                 var imgageData = getCanvas.toDataURL("image/png");                //Now browser starts downloading it instead of just showing it                var newData = imgageData.replace(/^data:image/png/, "data:application/octet-stream");                $("#btn-Convert-Html2Image").attr("download", "your_image.png").attr("href", newData);            );        );    script>body>html>

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *