with capturing the width of the print screen with jQuery

0

I have the following code:

HTML

<table style="width: 100%">
    <tr>
        <th>
            teste
        </th>
    </tr>
</table>

JQUERY

    // Imprime a página
    window.print();
    // Redireciona página
    window.location = 'link';

Well the problem I have and the following. When printing on an A4 sheet the table occupies the entire screen correctly. But I put up a receipt and I want to print it on a non-fiscal printer, and it uses tape ends at 80mm, and the table is cut, as if it printed only half.

Well the solution I have in bundle, and have jQuery capture the width of the print sheet and change the css of the table.

Does anyone know how to do this? Or is there a better solution?

    
asked by anonymous 27.08.2016 / 21:37

1 answer

1

It is not yet possible to know print screen information in JS, so you can not capture the width of the print screen in jQuery.

Something you can do is use @media queries from CSS3 and make changes to the page according to the width / height of the print screen.

That may be enough.

(In% with% you must specify sheet widths.)

/* semelhante à 90mm */
@media print and (min-width: 80mm) {
    table {
        width: 350px;
    }
}

/* ... */
@media print and (min-width: 121mm) {
    table {
        width: 450px;
    }
}

/* +A5, A4, ... */
@media print and (min-width: 152mm) {
    table {
        width: 100%;
    }
}

You can declare how many min-width you want.

    
27.08.2016 / 22:10