JSFiddle - React, Tailwind, and code Playground

by chauhangs

HTML

<div id="footer">
        This will be printed. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a quam at nibh adipiscing interdum. Nulla vitae accumsan ante. 
    </div>
<div>
    This will not be printed.
</div>

<div id="anotherdiv">
    Nor will this.
</div>

<input type="button" value="Print Div" onclick="PrintElem('#footer')" />

CSS

#footer{
clear: left;
width: 100%;
height: 100px;
margin: 0;
margin-top: 1em;
position: relative;
background: #69a148;
background: rgb(87,122,55);
background: -moz-radial-gradient(center, ellipse cover,  rgba(87,122,55,1) 0%, rgba(105,161,72,1) 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(87,122,55,1)), color-stop(100%,rgba(105,161,72,1)));
background: -webkit-radial-gradient(center, ellipse cover,  rgba(87,122,55,1) 0%,rgba(105,161,72,1) 100%);
background: -o-radial-gradient(center, ellipse cover,  rgba(87,122,55,1) 0%,rgba(105,161,72,1) 100%);
background: -ms-radial-gradient(center, ellipse cover,  rgba(87,122,55,1) 0%,rgba(105,161,72,1) 100%);
background: radial-gradient(ellipse at center,  rgba(87,122,55,1) 0%,rgba(105,161,72,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#577a37', endColorstr='#69a148',GradientType=1 );
color: #eee;
text-align: center;
padding: 0;
}

JavaScript

function PrintElem(elem)
    {
        Popup($('<div/>').append($(elem).clone()).html());
    }

    function Popup(data) 
    {
        var mywindow = window.open('', 'my div', 'height=400,width=600');
        mywindow.document.write('<html><head><title>my div</title>');
         mywindow.document.write('<link rel="stylesheet" href="http://www.dynamicdrive.com/ddincludes/mainstyle.css" type="text/css" />');
        mywindow.document.write('</head><body >');
        mywindow.document.write(data);
        mywindow.document.write('</body></html>');

        mywindow.print();
      //  mywindow.close();

        return true;
    }