Print text positioned in image

1

I have text positioned in the center of an image, the logic is to print a certificate, and this text is generated dynamically, this occurs correctly. The problem is at the time of printing, that the text is on page 2 the image on page 1

HTML:

<divid="DivImpressao">
<section id="AtestadoTecnico">                          
       <img id="imgAtestado" src="~/Images/Site/AtestadoTecnico.png" runat="server" class="imgAtestadoTecnico" height="685" />                           
        <div class="txtAtestadoTecnico">
                <div style="text-align: justify; font-family: Ebrima; font-size: 10pt; margin-top: 20px">
                    //texto aqui
                </div>
         </div>
      </section>

CSS:

#AtestadoTecnico {
    width: 1014px;
    height: 670px;
    position: relative;
}

.imgAtestadoTecnico {
    top: 0px;
    bottom: 20px;
    position: absolute;
}

.txtAtestadoTecnico {
    top: 100px;
    left: 120px;
    position: absolute;
}

JavaScript (here I give "DivImpression" as a parameter for printing:

function imprimePanel(elementId) {
    var printContent = document.getElementById(elementId);
    var windowUrl = 'about:blank';
    var uniqueName = new Date();
    var windowName = 'Print' + uniqueName.getTime();
    var printWindow = window.open(windowUrl, windowName, 'left=50000,top=50000,width=0,height=0');
    printWindow.document.write(printContent.innerHTML);
    printWindow.document.close();
    printWindow.focus();
    printWindow.print();
    printWindow.close();
}
    
asked by anonymous 07.05.2018 / 22:37

1 answer

0

I was able to solve using a plugin for Jquery called printThis Very simple to use and the page was perfect.

$('selector').printThis();
    
08.05.2018 / 06:32