JavaScript imprimer Événements

Les requêtes multimédias offrent un glorious moyen de modifier par programmation le comportement en fonction de l’état de visualisation. Nous pouvons cibler les types sur l’appareil, le ratio de pixels, la taille de l’écran et même l’impression. Cela dit, il est également agréable d’avoir des événements JavaScript qui nous permettent également de modifier le comportement. Saviez-vous que des événements vous sont proposés avant et après l’impression ?

j’ai toujours utilisé @media print dans les feuilles de type pour contrôler l’affichage de l’impression, mais JavaScript fournit beforeprint et afterprint événements:

perform toggleImages(cover = false) {
  doc.querySelectorAll('img').forEach(img => {
    img.type.show = cover ? 'none' : '';
  });
}

// Conceal pictures to avoid wasting toner/ink throughout printing
window.addEventListener('beforeprint', () => toggleImages(true))
window.addEventListener('afterprint', () => toggleImages());

Cela peut sembler étrange, mais il est très vital de prendre en compte l’impression, en particulier lorsque votre website Internet est centré sur la documentation. À mes débuts sur le Internet, j’avais un shopper qui ne « voyait » son website Internet qu’à partir d’imprimés. Coiffer avec @media print est généralement la meilleure possibility, mais ces événements JavaScript peuvent vous aider !