hola amigos de Phpres me gustaria saber como puedo poner un boton en mi web que al hacer clic se pueda imprimir la pagina que esta viendo el usuario en ese momento

estoy haciendo un sistema de compra ventas y necesito que los visitantes puedan imprimir la ficha de los productos que se listan en las diferentes categorías

gracias de antemano
Editado
0
Puntos
1525
Visitas
3
Resp
Por zero93 hace 8 años
Novice
Respuesta #1
hola puedes hacerlo con window.print() de javascript, te pongo un ejemplo:
<div id="capa1" style="background-color: #63fb45; margin: 20px; padding: 20px">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis, voluptate officia tempore minima architecto voluptates accusamus? Ex quaerat eius, quibusdam a quidem molestias totam, pariatur dolor fuga, vitae amet laborum!
</div>

<div id="capa2" style="background-color: #ffdd00; margin: 20px; padding: 20px">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis, voluptate officia tempore minima architecto voluptates accusamus? Ex quaerat eius, quibusdam a quidem molestias totam, pariatur dolor fuga, vitae amet laborum!
</div>

<a href="javascript: window.print();">Imprimir pagina</a>
también puedes hacer que algunos elementos no sean visibles en la impresión utilizando un poco de css:
<style>
  
@media print {
a {
    display:none;
}

}
</style>

<div id="capa1" style="background-color: #63fb45; margin: 20px; padding: 20px">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis, voluptate officia tempore minima architecto voluptates accusamus? Ex quaerat eius, quibusdam a quidem molestias totam, pariatur dolor fuga, vitae amet laborum!
</div>

<div id="capa2" style="background-color: #ffdd00; margin: 20px; padding: 20px">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis, voluptate officia tempore minima architecto voluptates accusamus? Ex quaerat eius, quibusdam a quidem molestias totam, pariatur dolor fuga, vitae amet laborum!
</div>

<a href="javascript: window.print();">Imprimir pagina</a>
de esta manera el boton imprimir pagina no apareceria en la impresión, si quieres agregar mas elemetos que no sean visibles solo tienes que agregarlos al media print del css:
<style>
  
@media print {
a,
#capa1 {
    display:none;
}

}
</style>
;)
2
Puntos
Por alber hace 8 años
Admin
Respuesta #2
te dejo una pequeña demo https://jsfiddle.net/Phpres/4j2mLt0o/
2
Puntos
Por alber hace 8 años
Admin
Respuesta #3
gracias por tu ayuda como siempreee
0
Puntos
Por zero93 hace 8 años
Novice
Para comentar Inicia sesión o Regístrate
Phpres 2025@ All rights reserved.
Utilizamos cookies para mejorar la navegación en el sitio. Más información Aceptar