Javascript Print In A New Window Won't Display Images
I'am struggling with a problem and I was hoping you can help me. I created a function that prints out data from inputs in a page. However, logo I am using on a print page won't be
Solution 1:
Here is the solution for everyone out there who has this problem. Problem is with the browsers. They are designed not to print images like this in order to save printers ink. Walkaround for this problem is using CSS media print and list-style-image.
CSS:
@media all{
printed-div{
display:none;
}
}
@media print{
printed-div{
display:block;
}
.logo-print{
width:291px;
height:109px;
display: list-item;
list-style-image: url(../images/logo_print.png);
list-style-position: inside;
}
}
HTML
<divclass="printed-div"></div>
JAVASCRIPT
function printReport() {
$(".printed-div").html();
var vin = $("input[name='vin']").val();
var make = $("select[name='make']").val();
var printData = '<tablewidth="960"border="0"align="center"><tr><tdcolspan="2"><divclass="logo-print"></div></td></tr><tr><tdcolspan="2"><divalign="center">Report</div></td></tr><tr><td> </td><td> </td></tr><tr><tdwidth="260">Vin:</td><tdwidth="700"><b>'+ vin +'</b></td></tr><tr><td>Make:</td><td><b>'+ make +'</b></td></tr></table>';
$(".printed-div").append(printData);
}
Solution 2:
I know it's too late for your answer but it could help someone else, who are searching for this.
before-
win.print();
place below code.
$(win).load(function(){
});
Post a Comment for "Javascript Print In A New Window Won't Display Images"