Skip to content

Instantly share code, notes, and snippets.

@MauricioMoraes

MauricioMoraes/print_element.html

Created February 5, 2020 18:04
Show Gist options
  • Save MauricioMoraes/693fa357d5e16b3ae506838dbadc2c87 to your computer and use it in GitHub Desktop.
Save MauricioMoraes/693fa357d5e16b3ae506838dbadc2c87 to your computer and use it in GitHub Desktop.
Download ZIP
Print the contents of a div with a given stylesheet
Raw
print_element.html
<div id='print-wrapper'>
CONTENT TO PRINT
</div>
<button id="print">PRINT</button>
<script>
function printElem(elem, titleText, headerText, stylesheet_url){
var mywindow = window.open('', '_blank', "width="+screen.availWidth+",height="+screen.availHeight);
mywindow.document.write('<html><head><title>' + titleText + '</title>');
mywindow.document.write('</head><body >');
mywindow.document.write('<h1>' + headerText + '</h1>');
mywindow.document.write(document.getElementById(elem).innerHTML);
mywindow.document.write('</body><link href="' + stylesheet_url + '" media="all" rel="stylesheet" /><script>setTimeout(function(){window.print();}, 300);</script></html>');
mywindow.document.close(); // necessary for IE >= 10
mywindow.focus(); // necessary for IE >= 10*/
return true;
}
$(document).on('click', '#print', function(e){
e.preventDefault();
printElem('print-wrapper', 'Título', 'Header text', 'https://ordexa.com.br/assets/css/style.css');
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment