Você está usando um navegador desatualizado. Para a visualização correta, atualize seu navegador:

Mapa do site


SimpleUi

Atualizando

Código para Impressão Download

? - +
Janela modal
  1. Crie um gatilho com a classe ui_print que irá disparar a impressão
    • Esse elemento pode ser qualquer tag
  2. Em qualquer parte do seu Html, envolva o conteúdo que será impresso dentro de uma classe ui_printDiv.
    • Esse elemento pode ser qualquer tag
Pronto! Isso é suficiente. Caso queira, você pode customizar a função:
  1. Por padrão, o documento é impresso imediatamente após a abertura da janela de impressão.
    • Para alterar esse padrão, use o atributo data-auto com o valor false. Padrão: true
    • Nesse caso, será incluído um botão de imprimir à janela de impressão
  2. A largura e altura da janela de impressão são, respectivamente: 920px e 600px
    • Para definir uma largura, use o atributo data-width e informe o valor desejado, ex: data-width="500"
    • Para a altura, siga o mesmo procedimento usando o atributo data-height
  3. Insira um elemento com a classe ui_printInvisible para incluir um conteúdo invisível à impressão
    • O conteúdo desse elemento não aparece em tela, mas será impresso
    • Pode ser qualquer tag e estar localizado em qualquer local
      do Html, desde que esteja dentro do box ui_printDiv.
  4. Insira um elemento com a classe ui_printForbidden para incluir um conteúdo vedado à impressão
    • O conteúdo desse elemento aparece em tela, mas não será impresso
    • Pode ser qualquer tag e estar localizado em qualquer local
      do Html, desde que esteja dentro do box ui_printDiv.
  1. A função de impressão pode ser usada mais de uma vez no mesmo documento
    • Havendo mais de um elemento de impressão, cada botão (gatilho) fará referência para o seu respectivo elemento de acordo com a ordem de renderização.
    • O primeiro botão irá imprimir o primeiro ui_printDiv, o segundo botão irá imprimir o segundo ui_printDiv renderizado no código-fonte e assim sucessivamente.
    • Ou seja, a restrição é não cruzar botões e conteúdos de impressão.
  2. O elemento ui_printDiv imprime o conteúdo dentro dele, exclusive. Ou seja, o próprio elemento não é renderizado no popup de impressão.
  3. No core do Framework, há uma função que captura os eventos antes e depois de uma impressão via browser que pode ser configurada pors usuários avançados
Customizar


Tipo do gatilho

A marcação do gatilho será . Saiba mais
Qualquer marcação (tag) pode ser usada como gatilho, como:
  • links (<a>)
  • botão (<button>)
  • parágrafos (<p>)
  • inputs (<input type="button">, <input type="submit">, etc.)
  • Dentre outros.

Visualização de impressão

. Padrão: true
A janela terá px de largura e de altura. Padrão: 920px x 600px

Conteúdo extra

. Não aparece em tela, mas será impresso
. Aparece em tela, mas não será impresso
Esses elementos podem ser qualquer tag e estar localizados em qualquer local
do Html, desde que estejam dentro do box ui_printDiv.
Tem certeza que deseja reiniciar todos os valores?

Resultado para Impressão