[Résolu]Réagencement pour l'impression

Bonjour, je reviens à la charge.

Je sais qu'avec CSS on peut créer une version d'une page dédiée a l'impression. Changer la police, faire disparaitre certains élements...
Mais ce que je souhaiterais c'est carément ré-agencer certaint éléments.
Je m'explique, vous vous souvenez de mon switch entre 2 images (vitrine + plan d'acces), maintenant je veux les imprimer, sauf que l'image du plan est plus grande (c'est un autre fichier +grand).
Pour le moment je suis parvenu a imprimer mon grand plan, en fait j'ai insérer ce plan sur ma page et je lui applique le style display:none, puis j'ai créer un lien "imprimer" qui lance une petite fonction qui passe ce style a display:block, parce que via la feuille css dédiée a l'impression ca marche pas (j'ai pas compris pourquoi ). Cette feuille css "print.css" fait disparaitre tout le superflu, je garde juste, la vignette et l'adresse. Au final j'ais le grand plan, au dessus en surimpression l'adresse et en dessous la vignette.
Ce qui vas pas, c'est que j'aimerais que la vignette soit dans l'angle bas-droit en surimpression de mon plan et surtout qu'elle contienne l'image de la vitrine, parce que là elle contient l'image présente au chargement de la page (a savoir le plan) même si je switche les images avant de lancer l'impression.
J'ai bien essaye d'appeler la fonction qui switche dans la fonction qui imprime, mais aucun effet. Et pour terminer une fois l'impression faite, l'image du grand plan, auparavant masquée, est dorénavant affichée sur la page.
Voici la fonction qui imprime:

function printplan(){
document.getElementById('plan-acces').style.display = 'block'; //affiche le plan caché
window.print();
}

J'ai essaye de repassé le style a display:none apres l'appel a print() mais si je fait sa le plan n'est plus imprimé .

Bref, j'y voit plus tres clair, je demande votre aide.
Merci.

ps: Vu que j'ai pas d'imprimante pour tester si je fait apercu avant impression (sous firefox) le grand plan ne s'imprime pas, s'imprime que la vignette et l'adresse. Par contre si je fait une impression dans un fichier pdf (PDFCreator) là j'ai mon grand plan qui s'affiche. Est-ce normal ? Me faut-il a tout prix une imprimant pour être sûr du résultat
Modifié par EdWong (06 Jun 2006 - 08:03)

Bonjour,

Pour ma part, je passerai par le fichier print.css pour gérer tout ca.

Ensuite, pour les tests, créées toi une feuille de style nommée "test" (par exemple ) dans laquelle tu copites en premier ta feuille de style classique suite à quoi tu copites ta feuille de style print.

Sers toi ensuite de cette feuille de style test pour visualiser à l'écran ce qui sortira à l'imprimante.

J'ai réglé la plupart de mes problemes, en fait si la feuille print.css ne marchait pas pour afficher le plan c'est parce que les styles qui décrivait la disposition de mes image etait intégrer a ma page, du coup je les ais mis sur une feuille externe. Donc maintenant j'ai deux feuilles une pour chaque media.

Reste un probleme, si l'utilisateur lance l'impression tout de suite, tout sera bien positionné Plan - vitrine dans l'angle en surimpression - adresse en dessous du plan. Mais si l'utilisateur fait un switch image avant de lancer l'impression, ce switch est répercuté à l'impression (normal quoi) sauf que du coup mon plan d'acces se retrouve tout piti en vignette. Ca doit se régler avec Javascript, je pense pas que CSS le permette.

Edit: J'ai pensé a un refresh de la page avant de lancer print(), mais sous Firefox il me refuse l'impression sous prétexte que la page a changé, et sous IE il lance l'impression mais sans avoir pris en compte le refresh.

Re-edit: J'ais trouvé la solution, si l'utilisateur fait un switch une variable globale (swh) est incrémentée de 1, donc si l'utilisateur fait un nombre impair de switch il faut que la fonction printplan() en fasse un de plus, afin d'avoir les image dans le bon ordre pour l'impression.

Voilà le code des fonctions:

var swh = 0;//variable qui permet de déterminer si un swicth a ete fait
function switchimg(){
	swh += 1;
	var vign = document.getElementById('vignette').src;
	var grde = document.getElementById('grde').src;
	document.getElementById('grde').src = vign;
	document.getElementById('vignette').src = grde;
}

function printplan(){
	if (swh % 2 == 1){//si swh impair alors l'user à fait 1-3-5-7-9... switch
		var vign = document.getElementById('vignette').src;
		var grde = document.getElementById('grde').src;
		document.getElementById('grde').src = vign;
		document.getElementById('vignette').src = grde;
	}
	window.print();	
}

Modifié par EdWong (02 Jun 2006 - 12:00)