Probleme d'impression d'image en JS

Par ThibaultJ, il y a 10 ans

Javascript

Bonjour,

C'est encore moi !

J'arrive a imprimer une page en js là n'est pas le probléme !!
J'ai une image de fond et j'aimerais quel s'imprime voici mon code :

<!DOCTYPE html> <html> <head> <title>Ma Page</title> <link href='https://fonts.googleapis.com/css?family=Lobster|Indie+Flower|Open+Sans' rel='stylesheet' type='text/css'> <style> body{ background: url(../img/mon_image.png) no-repeat top left; width: 721px; height: 939px; text-align:center; font-family: 'Open Sans', sans-serif; } .eta{margin-top: 50px;} .tit{font-family: 'Lobster', cursive;font-size: 36px;} .men{font-family: 'Indie Flower', cursive;} .des{font-family: 'Indie Flower', cursive;} </style> </head> <body onload="window.print();"> <h2 class="eta">%NOM ETA%</h2> <h3 class="tit">%TITRE%</h3> <p class="men">%MENTION%</p> <h1 class="gti">%GROS TITRE%</h1> <p class="des">%DES%</p> </body> </html>

Ceci est le code épurer car la partie php est inutile ici.
J'ai déja cherche sur Google mais surment mal) c'est pur ca que je suis là.

Merci d'avance,
TJ_

12 réponses

ThibaultJ, il y a 10 ans

Volqan, il y a 10 ans

Salut,

Essaie ça. Sous chrome :

Benjamin Derepas, il y a 10 ans

Tu peux aussi passer par les media queries spécifique au print et forcer l'affichager du background. (Il me semble que par défault le body background est à #fff ou transparent, à vérifier) .
Toute fois je te déconseille cette pratique d'afficher les background en impression.

ThibaultJ, il y a 10 ans

Merci pour vos réponse mais je pense que si un utilisateur est obliger de faire cette manip, il va se dire : "Bon ok, c'est trop compliqué, je laisse tombé !" J'ai aussi essayez de faire plusierus fichier css (Pas comme dans le code ci-dessus) avec en media print mais ca ne fonctionne pas !
TJ_

Benjamin Derepas, il y a 10 ans

Montres nous ton code pour le média print (il faut utiliser les !importantpour forcer les propriétés )

ThibaultJ, il y a 10 ans

Je sais et c'est exactement ça :

body{ background: url(../img/mon_image.png) no-repeat top left !important; width: 721px; height: 939px; text-align:center; font-family: 'Open Sans', sans-serif; } .eta{margin-top: 50px;} .tit{font-family: 'Lobster', cursive;font-size: 36px;} .men{font-family: 'Indie Flower', cursive;} .des{font-family: 'Indie Flower', cursive;}

Voilà mais rien ni fait ca ne veux pas imprimer mon image de fond.
TJ_

Benjamin Derepas, il y a 10 ans

essais en decortiquant la propriete background (image' positon' repeat) en forcant a chaque fois, sait on jamais

ThibaultJ, il y a 10 ans

Nope Benjamin Derepas ca ne fonctionne toujours pas !

Benjamin Derepas, il y a 10 ans

Tu peux regarder du coté de la propriété de webkit print color adjust .
Mais comme tu le verra , il n'est pas recommandé de l'utiliser

ThibaultJ, il y a 10 ans

Non plus toujours pas !

Benjamin Derepas, il y a 10 ans

Qu'a tu trouver de ton coter ?

ThibaultJ, il y a 10 ans

Ce que je vais faire c'est generer un document pdf et comme ca mon utilisateur pourat imprimer enregistrer etc !!!