imprimer une seule partie d'une page

Bonjour !

Est il possible d'imprimer une seule partie d'une page web en imprimant que certains elements en leur donnant des ID et en utilisant getElementById

Merci pour votre aide

en CSS oui c possible

en javascript tu peux peut etre faire une fonction javascript

Code:

---

1 2 3 4 5

function imprimer(){ //efface le div document.getElementByID("noprint").innerhtml=""; window.print(); }

---

bonjour,

le meilleur moyen serait :

1. d'ouvrir une pop-up
2. de coller dans la pop-up les éléments ciblés
3. d'imprimer la pop-up

Il existe également le média print en CSS

Code:

---

1 2 3

@media print { }

---

ne l'ayant jamais utilisé, j'ignore si c'est compatible avec tous les navigateurs.:oops:

Merci pour vos reponses l'option javascript je veux bien l'utiliser mais noprint dans getElementById ça refere à quoi au juste ?

getElementById(truc) < va chercher l'élément avec l'id truc

Code:

---

1 2	<div id="noprint"> </div>

---

Citation:

---

Envoyé par LeXo

en CSS oui c possible

en javascript tu peux peut etre faire une fonction javascript

Code:

---

1 2 3 4 5

function imprimer(){ //efface le div document.getElementByID("noprint").innerhtml=""; window.print(); }

---

---

je ferai plutôt

Code:

---

1 2 3

document.getElementById("noprint").style.display = "none";//on cache l element window.print();

---

histoire de ne pas perdre le contenu de l'élément, puis lorsque la page est imprimée :

Code:

---

1 2	document.getElementById("noprint").style.display = "block";//on affiche l element

---

au passage c'est Id et non ID ;)

Code:

---

1 2	document.getElementById("noprint")

---

Et il faut que l'id soit unique dans ta page ;)

tu fais un css pour l'affichage écran et un CSS pour l'affiche impression

et tu lui attibues la sortie comme suis

Code:

---

1 2	<link rel="stylesheet" type="text\css" href="impression.css" media="print"> <link rel="stylesheet" type="text\css" href="affichage.css" media="screen">

---

Code:

---

1 2 3 4

//ne pas imprimer .maClasse{ display=none; }

---

Citation:

---

Envoyé par LeXo

Code:

---

1 2 3 4

//ne pas imprimer .maClasse{ display=none; }

---

---

petite correction ;)

Code:

---

1 2 3 4

//ne pas imprimer .maClasse{ display : none; }

---

arf
oui effectivement

bon je vais devoir exposer la solution css2.0 pour me rattraper

t'as ton style.css

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

//défini les parametres de définition sur la sortie d'impression @media print { Body{ ... } }   //défini les parametres de définition sur la sortie d'écran @media screen { Body{ ... } }   //défini les parametres de définition sur la sortie écran & impression @media screen,print { .maClasse{ ... } }

---

sinon
utiliser le .style.visible

Code:

---

1 2 3 4

document.getElementByid('monId').style.visibility="visible";   document.getElementByid('monId').style.visibility="hidden";

---

Display none
ou visibility hidden,
tout est question du reésultat souhaité (mise en page)

mais quoi qu'il en soit il est plus simple de passer par media screen et media print ...