[HTML Javascript] Pr�server les style d'un document.writeln

**BahCmoi** · 27/03/2006, 18h47

Salut,

j'aimerais savoir comment peut-on pr�server les styles issus d'un fichier CSS dans un WriteLine javascript...
Dans ma balise body je fais un

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

<body OnLoad="MaFonctionWriteLn()">

o� ma fonctionMaFonctionWriteLn() est charg�e en extrayant des param�tres de l'adresse href d'�crire dans le document � des endroits bien pr�cis � l'aide de variables locales...
le probl�me c'est que les styles ne sont pas appliqu�s
par exemple, voici un bout de mon code:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
[...]
maString="<table><tr><td class=StyleTruc height=47 width=724 colspan=4><hr>" + MaVariableTexte + "</td></tr></table>";
[...]
document.writeln(maString);

C'est le style "StyleTruc" qui n'est pas appliqu� alors que dans mon doc est bien �crit:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

<link href="../../messtyles/stylepage.css" rel=stylesheet type=text/css>

de toute fa�on, ces styles fonctionnent puisque je les exploite dans une autre page.

Pouvez-vous me dire comment je peux proc�der pour que la mise en forme se fasse avec mon CSS ?
J'ai m�me essay� de les copier dans le doc lui-m�me, mais �a ne change rien...

Merci par avance

**BahCmoi** · 28/03/2006, 10h36

Salut

euh j'ai provisoirement solutionn� mon probl�me en greffant des balises

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

<font style="">

� la place des

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

class=MonStyle

mais je suis ouvert � toute proposition concernant cette possibilit�.

**javatwister** · 28/03/2006, 11h08

ton writeln charge une nouvelle page, exempte de toute css! comment veux-tu que les styles soient conserv�s?

**BahCmoi** · 29/03/2006, 14h39

Envoy� par javatwister

ton writeln charge une nouvelle page, exempte de toute css! comment veux-tu que les styles soient conserv�s?

Bonjour

Merci pour cette remarque/r�ponse...
Je m'en doute mais, j'ai bien mis cette r�f�rence dans mes <HEAD>

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

<link href="../../messtyles/stylepage.css" rel=stylesheet type=text/css>

Pourquoi il sait lire le OnLoad de la balise BODY (D'ailleurs, je ne comprends pas non plus pourquoi il ne sait pas attribuer mon BGCOLOR="#988EB1" de la balise BODY ...) et pas link href de la balise HEAD ?

Comment t'y prendrais-tu alors toi ?
Moi, ce que je souhaite, c'est ouvrir cette page et que du texte change dynamiquement dedans en fonction de ce que lui passe... Je comprends le principe mais pas le fonctionnement en toute apparence.

Merci d'avoir r�pondu

**SpaceFrog** · 29/03/2006, 14h42

pourquoi fais tu un writeln ?

passe plutot par un innerHTML ou encore un createElement ...

**BahCmoi** · 29/03/2006, 14h47

Re,

Ben parce que je sais pas faire autrement.
Le but est simple, j'ai une s�rie d'image dans une page sous forme de mosaic et je clique sur une des images.
L�, une page s'ouvre avec l'image agrandie et le texte qu'il l'accompagne plus deux trois information en plus et dans la page il y a un lien pour fermer et revenir, c'est tout.

**SpaceFrog** · 29/03/2006, 14h50

deux possibilit�s selon moi:

un popup et tu y colles ton image et ton texte

un div qu tu passe de display:none � display:bloc

**javatwister** · 29/03/2006, 14h51

aucun rapport avec write

tu mets la charrue avant les boeufs en voulant � tout prix utiliser une m�thode plut�t qu'en cherchant les m�thodes pour atteindre ton but;

**javatwister** · 29/03/2006, 14h58

ouvre une page pr�d�finie (agrandissement.htm);
ins�re ton image proprement dans le corps de cette page;

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
mon_image.onclick=function(){
win2=window.open("agrandissement.htm","grand");
var adr=this.src.replace(".jpg","b.jpg");
var im=document.createElement("img");
im.src="adr";
var texte=liste_de_textes[indice_de_mon_image];
win2.document.getElementById("conteneur_image").appendChild(im);
win2.document.getElementById("conteneur_texte").appendChild(texte);
}

**SpaceFrog** · 29/03/2006, 15h03

c'est comment dirais-je ...
p�tissier ?

**BahCmoi** · 29/03/2006, 15h20

merci javatwister.
j'ai pas bien compris... en testant ton code j'ai une erreur

this.src est une valeur null ou n'est pas un objet

**javatwister** · 29/03/2006, 17h10

si mon_image est bien une image d�finie, il n'y aura pas d'erreur;

**BahCmoi** · 29/03/2006, 17h40

Euh, oui, pour toi peut-�tre...
C'est comme tous les gens qui maitrisent leur truc, il ont l'impression que ce qu'il expliquent est compr�hensible.
moi, je suis pas super � l'aise avec ce... langage...

voil� ce que j'ai �crit pour la page de test:

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<html>
 
<head>
<title>Essai</title>
</head>
 
<script>
function MaFonction()
{ 
	win2=window.open("agrandissement.htm","grand"); 
	var adr=this.src.replace(".jpg","b.jpg"); 
	var im=document.createElement("img"); 
	im.src="adr"; 
	//**** var texte=liste_de_textes[indice_de_mon_image]; 
	win2.document.getElementById("conteneur_image").appendChild(im); 
	//**** win2.document.getElementById("conteneur_texte").appendChild(texte); 
}
</script>
 
<body>
 
<img border="0" 
		 src="inspecteur.jpg" 
		 width="99" 
		 height="120"
		 onclick="MaFonction()">
</body>
</html>

et �a pour "agrandissement"

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<html>
 
<head>
</head>
 
<body>
 
	<div id="conteneur_image" style="width: 311; height: 380">
 
	</div>
	<div id="conteneur_texte" style="width: 311; height: 10">
 
	</div>
 
</body>
 
</html>

Dans ma racine j'ai une tite image (inspecteur.jpg) et une grande (inspecteurb.jpg)...

je sens que je vais me faire jeter

**javatwister** · 29/03/2006, 17h43

nan nan, t'en es pas loin!
c'est juste que j'avais pr�vu le code pour un nombre x d'images;

pour garder ton code, passe simplement this en param�tre;

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

<img onclick="MaFonction(this)" />

et dans la fonction

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
function MaFonction(obj){
 
// et tu peux remplacer "this" par "obj";
 
}

**BahCmoi** · 29/03/2006, 18h09

ravie de savoir que j'�tais pas loin

mais je ma�trise pas trop les tableaux en zavascript d'o� mes REM devant les conteneurs texte
j'ai fait les modifs et j'ai une autre erreur

win2.document.getElementById("conteneur_texte").appendChild(texte) est une valeur null ou n'est pas un objet

d�cid�ment, je suis pas dou�e

**BahCmoi** · 30/03/2006, 10h21

Bon, c'est pas grave...
Je me d�brouille autrement parce m�me avec ta r�ponse, javatwister, �a ne r�sound pas mon probl�me de CSS.
Je garde mes <font style=""> pour l'instant.

Merci pour vos r�ponses

**BahCmoi** · 03/04/2006, 11h08

Bonjour,

J'ai fini par trouver...
En fait, je cr��e une nouvelle instance de la page � chaque clic sur mon image thumbnail qui faisait appel � l'instruction.

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

document.writeln(maString);

Mais pour exploiter mon CSS, il fallait aussi sp�cifier le chemin du CSS dans mon document.writeln()...
Ce qu je n'avais pas compris, c'�tait que la totalit� de la page �tait g�n�r�e. C'est en regardant le code source de la page que j'ai compris.

Maintenant �a marche imp�cablement bien.
Merci � ceux qui se sont int�ress�s � mon probl�me.

[HTML Javascript] Pr�server les style d'un document.writeln

JavaScript

Discussions similaires

Partager

Partager