| IMPRIMER |
Outils pour webmaster. Trucs et astuces en code HTML et JavaScript : améliorer son site internet
Descriptif : imprimer une page est une
fonction relativement simple. Il suffit de cliquer sur l'icône de l'imprimante de votre
navigateur ou, par un clic droit, accéder au menu déroulant au bout du pointeur de la
souris. Donc, pourquoi une telle page d'explications. La chose n'est pas si simple lorsque
vous voulez imprimer une autre page que celle présente à l'écran ou imprimer un seul
élément de la page ou encore lorsque vous avez fait en sorte que la navigation dans vos
pages se fasse totalement plein écran. De plus, lorsqu'on demande d'imprimer une page, il
peut arriver que tout s'imprime : le fond d'écran, les bannières publicitaires, les
boutons etc. Il se peut aussi que l'on souhaite imprimer uniquement le contenu d'une
boîte de dialogue. Tous les cas d'impression sont donc possible et le confort de
l'utilisateur ainsi que sa connaissance plus ou moins grande de la navigation sont à
envisager. Là encore quelques codes de JavaScript vous nous aider.
Nous allons examiner dans les exemples suivants quelles sont les
différentes solutions.
Descriptif n°1 : commençont par le plus simple : imprimer une page.
Exemple A : imprimer la page avec un lien : Imprimer cette page.
Entre les deux balises <body> et </body>
| <!--
DEBUT DU SCRIPT IMPRIMER--> <p><a href="javascript:window.print()">Imprimer cette page</a></p> <!-- FIN DU SCRIPT IMPRIMER--> |
Entre les deux balises <body> et </body>
| <!--
DEBUT DU SCRIPT IMPRIMER--> <p><input type="button" value="Imprimer cette page" onClick="window.print()"></p> <!-- FIN DU SCRIPT IMPRIMER--> |
Exemple C : imprimer la page avec une image :
Entre les deux balises <body> et </body>
| <!--
DEBUT DU SCRIPT IMPRIMER--> <p><a href="javascript:window.print()"><img src="image.gif"></a></p> <!-- FIN DU SCRIPT IMPRIMER--> |
Exemple D : imprimer une autre
page que
celle présente à l'écran. Vous souhaitez, par exemple, que le visiteur puisse imprimer
un règlement ou des instructions.
Le lien présent sur cette page va ouvrir un
pop-up,
comme suivant :
|
<!-- DEBUT DU SCRIPT POP-UP PARAMETRABLE--> <p align="center"><a href="javascript:void(0)" onClick="window.open('PAGE-IMPRIMABLE.htm',null,'width=325,height=300, status=no, directories=no, toolbar=no, location=no, menubar=no, scrollbars=no, resizable=no');"></p> <!-- FIN DU SCRIPT POP-UP PARAMETRABLE--> |
avec votre texte et qui contiendra l'instruction d'impression en JavaScript.
L'utilisateur n'a alors rien d'autre à faire. Si vous le souhaitez, un lien ou un bouton
permet au visiteur de choisir de ne pas imprimer cette page.
Imprimer Les Instructions.
Entre les deux balises <body> et </body> de la page où se trouve le texte à imprimer.
| <!--
DEBUT DU SCRIPT IMPRIMER--> <script language="javascript"> <!-- window.print() //--> </script> <!-- FIN DU SCRIPT IMPRIMER--> |
ou, si vous préférez, dans la ligne de la balise <body>
| <!--
DEBUT DU SCRIPT IMPRIMER--> <body onLoad="window.print()"> <!-- FIN DU SCRIPT IMPRIMER--> |
Remarque : l'instruction window.print() est compatible Netscape 4 et plus, Internet Explorer 5 et plus.
Descriptif n°2 : vous allez pouvoir imprimer par un bouton qui va sélectionner automatiquement un texte se trouvant dans une boîte de dialogue. Il vous suffit ensuite de choisir l'option : impression de la sélection dans la boîte de dialogue du panneau d'impression.
Exemple :
Mise en oeuvre : Sélectionnez et copiez directement à l'écran le code ci-dessous et collez-le dans votre page, code HTML visible.
Entre les deux balises <body> et </body>
| <!--
DEBUT DU SCRIPT IMPRIMER--> <script language="javascript"> document.write('<table align=center border=0 width=70% bgcolor=yellow><tr align=center><td>') document.write('<form><textarea NAME="txt" ROWS=5 COLS=70 WRAP>Cliquez sur le bouton IMPRIMER pour sélectionner ce texte et ouvrir le panneau d\'impression.</textarea>') document.write('<br><font color=red><b>') document.write('</td></tr></table>') document.write('<p align=center><input type=button name=button value="IMPRIMER" onClick="this.form.txt.select(); window.print()"></form>') </script> <!-- FIN DU SCRIPT IMPRIMER--> |
Remarque : pour plus de facilité, vous pouvez utiliser le convertisseur de code HTML en JavaScript afin d'écrire toutes les instructions HTML contenues dans document.write().