Imaginez une page web qui permet aux utilisateurs d'afficher un élément caché, en utilisant la méthode suivante javascript pour modifier les css un style CSS au moment de l'exécution.
Après sa décision (qui inclut la modification de la feuille de stlyes), l'utilisateur utilise la fonctionnalité d'impression de son navigateur.
Il semble que Internet Explorer ne respecte pas les changements effectués dans la feuille de style avant pendant impression si la définition css originale est située dans un fichier externe. Dans les autres navigateurs, tout fonctionne comme prévu.
Veuillez consulter l'exemple ci-dessous, qui modifie une classe de style par rapport à sa définition initiale display:none a display:inline au moment de l'exécution, d'où l'affichage de l'élément. Mais lors de l'impression de cette page, l'élément reste caché dans internet explorer (testé avec IE 6,7,8).
Avez-vous une solution ou une solution de contournement ?
Exemple minimaliste (fichier html) :
<html><head>
<LINK rel="stylesheet" type="text/css" href="minimal.css">
</head><body onload="displayCol();">
<script>
function displayCol()
{
var myrules;
if( document.styleSheets[0].cssRules ) {
myrules = document.styleSheets[0].cssRules;
} else {
if ( document.styleSheets[0].rules ) {
myrules = document.styleSheets[0].rules;
}
}
myrules[0].style.display = "inline";
}
</script>
<div class="col0" id="test">This is hidden by default.</div></body></html>minimal.css
.col0 {
display:none;
}UPDATE :
Veuillez noter que la décision d'afficher ou non l'objet est prise par l'utilisateur - elle n'est pas connue au moment de l'exécution !
