Triples parenthèses ? (problème de caractères)

**DarkVadorette** · 18/04/2011, 19h59

Bonjour\Bonsoir à tous et à toutes
Je suis un débutant en programmation.
Mon projet était de créer un portail Web, dont l'image de fond s'adaptait aux résolutions de l'user.
Je me suis donc servi d'un script JS écrivant dans la page HTML, dont voici le code :

Code html :

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
29
30
31
32
33
34
35
36
37
38
39
40
41
42
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
 
 
<SCRIPT language="JavaScript">
if ((screen.width==1024) && (screen.height==768))
{
 document.write ('<body align="center" style="background-image:url("portail/img/Fond1.png");background-repeat:no-repeat;">')
 
}
else if ((screen.width==1280) && (screen.height=8=00))
{
  document.write ('<body align="center" style="background-image:url("portail/img/Fond1.png");background-repeat:no-repeat;">')
 
}
else if ((screen.width==1366) && (screen.height==768))
{
  document.write ('<body align="center" style="background-image:url("portail/img/Fond1.png");background-repeat:no-repeat;">')
 
}
else if ((screen.width==1280) && (screen.height==1024))
{
  document.write ('<body align="center" style="background-image:url("portail/img/Fond1.png");background-repeat:no-repeat;">')
 
}
else if ((screen.width==1360) && (screen.height==768))
{
  document.write ('<body align="center" style="background-image:url("portail/img/Fond1.png");background-repeat:no-repeat;">')
 
}
</SCRIPT>
<div id="content">
	</div>
 
	<div class="clear"></div>
 
</div>
 
</body>
</html>

Comme vous pouvez vous en douter, ça ne marche pas, mais en plus la page est blanche. Donc aucun des attributs que j'ai placés dans la balise style ( "background-image:url("portail/img/Fond1.png");background-repeat:no-repeat;") n'ont fonctionné.
Quand j'ouvre ça avec mon développeur Chrome, je vois ça :

Donc il y a bien eu écriture d'une ligne, qui correspond effectivement à mon fond d'écran mais l'interprétation de ce que j'ai mis dans style n'a pas fonctionné, puisque j'obtiens au lieu de mon chemin d'accès cela :
" portail="" img="" fond1.png"

Une âme charitable pour m'aider ?
Merci d'avance.

**Bovino** · 18/04/2011, 20h03

C'est normal

Quand tu écris

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<body align="center" style="background-image:url("portail/img/Fond1.png");background-repeat:no-repeat;">

le " juste avant portail signifie fin de l'attribut style, le reste étant interprété comme de nouveaux attributs !

**DarkVadorette** · 18/04/2011, 20h14

Oui mais si j'utilise le caractère ' cela va ouvrir la chaîne puisque je l’utilise dans un document.write !
Quelle est la bonne syntaxe avec document.write pour ce que je veux faire ?

**Bovino** · 18/04/2011, 20h17

Il faut échapper les caractères avec un antislash, mais ceci dit, dans ton cas, les quotes ne sont pas nécessaires :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.write ('<body align="center" style="background-image:url(portail/img/Fond1.png);background-repeat:no-repeat;">')

Aïe ! Mes doigts me brûlent d'avoir osé écrire document.write(); !

**NoSmoking** · 18/04/2011, 22h30

à la lecture de tous ces document.write il m'apparaît que cela me paraît superflu, tu ne "pièges" pas toutes les résolutions et qui plus est dimension de l'écran ne signifie pas dimension de la fenêtre du navigateur.

Pourquoi ne pas passer par un background unique pour toutes les résolutions en utilisant le CSS

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
body{
  background: #fff url( image_fond.jpg) no-repeat fixed center top;
}

Le CSS3 autorise même

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

background-size: 100%;

En choisissant de façon opportune l'image de fond elle peut s'adapter ainsi aux différentes tailles de la page.

PS:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

else if ((screen.width==1280) && (screen.height=8=00))

je pense qu'il y a un coquille

Toujours la même image en référence, c'est voulu?

**DarkVadorette** · 19/04/2011, 10h34

Bonjour, merci à tous.
Merci pour la syntaxe Bovine.
NoSmoking, je ne peux pas passer par un background unique, puisque l'image de fond est contextuelle, ce n'est pas un simple fond décoratif, elle intègre le titre et les infos de bas de page.
Ce code CSS redimensionnera l'image de fond automatiquement selon la taille du navigateur ? En limitant la pixellisation ?
Merci pour la coquille, je pensais l'avoir corrigée.

Toujours la même image en référence, c'est voulu?

Comment ça ?

Merci de votre aide.

**RomainVALERI** · 19/04/2011, 10h46

Envoyé par DarkVadorette

Envoyé par NoSmoking

Toujours la même image en référence, c'est voulu?

Comment ça ?

Ben disons que tester la résolution de l'écran pour envoyer au final la même ligne exactement ça fait bizarre.... ^^

Ca revient à faire :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
if (a == 1) maFonction();
else if (a == 2) maFonction();
else maFonction();

**DarkVadorette** · 19/04/2011, 16h08

Ah oui, en fait je voulais mettre Fond2, Fond3, etc...
En tout cas le code marche, merci à vous.
Je passe en résolu.

Triples parenthèses ? (problème de caractères)

JavaScript

Discussions similaires

Partager

Partager