Print only part of an HTML page [duplicate]

Question

Print only part of an HTML page [duplicate]

Navigation

#1 by (2 votes)

0

I'm trying to print only the part of an HTML page that has a barcode. HTML:

<div class="barcode-img">
            <svg id="barcode"
                 jsbarcode-textmargin="0"
                 jsbarcode-fontoptions="bold"
                 style="width: 30%; height: 30%;">
            </svg>

            <script>
                JsBarcode("#barcode", "<?php echo $bar_number; ?>", {
                    format: "ean13",
                    width: 3
                });
            </script>
</div>

CSS:

@media print {
body * {
    visibility: hidden;
}

#barcode, #barcode *{
    visibility: visible;
}

#barcode
{
    position: fixed;
    left: 0px;
    top: 0px;
}

I've seen similar solutions in many places, but doing so my barcode appears twice or more on the print page.

Picture:

How can I solve this problem?

javascript html css

asked by anonymous 08.06.2017 / 15:47

1 answer

I can not enable caching and GZIP compression on my site. Because? Bringing pre-selected radio button via CakePhp

score 2 · Accepted Answer

var conteudo = document.getElementById('barcode').innerHTML;
var telaImpressao = window.open('about:blank');

telaImpressao.document.write(conteudo);
telaImpressao.window.print();
telaImpressao.window.close();

This answer is available here

You copy the content of your div to a new page and print it.