Modification style media print

Modification style media print - HTML/CSS - Programmation

Marsh Posté le 11-01-2006 à 07:46:44    

Bonjour,
 
J'ai une page JSP tout à faire standard, basée sur du CSS, tout à fait standard.
Cette page affiche un certain nombre de graphique, de tableaux, de données en tout genre.
J'ai défini deux médias, l'un pour l'affichage (screen), l'autre pour l'impression (print).
Comme vous pouvez le voir, rien de bien sensationnel, que du basique, du standard.
 
L'utilisateur, via des <input> de type checkbox, a la possibilité d'imprimer les éléments qu'il veut.
Un script JavaScript est appelé via la méthode onClick de ces 'input'.
Dans ce script, je voudrais pouvoir accéder au style 'visibility' du media print.
Comment puis-je faire ?
 
Pour résumé, je voudrais pouvoir écrire qqch comme : le_composant.style.visibility = "visible" (ou "hidden" ) mais pour le media print.
 
Merci pour votre aide.
 
Franck

Reply

Marsh Posté le 11-01-2006 à 07:46:44   

Reply

Marsh Posté le 11-01-2006 à 12:30:51    

Le plus simple : tu définis une classe qui rend visible et tu met le reste en invisible par défaut.
Ensuite, en javascript, tu rajoutes ou enléve cette classe de la liste des classes de chaque élément à imprimer/ne pas imprimer.

Reply

Marsh Posté le 12-01-2006 à 12:04:32    

En fait, je suis passé par document.styleSheets. Voici du JavaScript qui fonctionne très bien sous FireFox mais pas sous IE :
 

Code :
  1. // document.styleSheets[1] correspond au media print de ma feuille de style
  2. var CSSRules = document.styleSheets[1].cssRules;
  3. // spécificité IE ...
  4. if (uagent.indexOf("MSIE" ) != -1) {
  5. CSSRules = document.styleSheets[1].rules;
  6. }
  7. // autre spécificité IE ...
  8. var rule = CSSRules[10];
  9. if (uagent.indexOf("MSIE" ) != -1) {
  10. rule = CSSRules[9];
  11. }
  12. // ctrl est le 'input' de type checkbox
  13. if (ctrl.checked) {
  14. rule.style.display = "block";
  15. } else {
  16. rule.style.display = "none";
  17. }


 
Bizarrement, sous IE, le bloc sur lequel est appliqué le display = "none"; est toujours imprimé, alors que si dans la CSS du media print, j'ai
 

Code :
  1. #ddm_print {
  2.   display: none;
  3. }


 
le bloc n'est pas imprimé ......... Comme si la modification du style n'est pas appliqué (sachant que le style display est à 'block' par défaut dans la CSS).
 
 
A noter que si j'utilise l'attribut 'visibility', sous Firefox, j'avais un joli espace blanc à la place du composant, alors qu'avec display, la zone n'apparaît pas (euh, je suis clair, là ?) et ça ne fonctionne pas sous IE, de toute façon.
 
 
Si quelqu'un a une idée, je suis preneur.

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed