une modification du style fait perdre tous le reste du style, pourquoi ?

bonjour,

je fais le code suivant pour modifier dynamiquement le background d'un tableau :

Code:

---

<script>document.getElementById('tab_chapitre').style.background='url(../../gfx/e/e_chapitre_news.jpg)';</script>

---

Le tableau est ainsi avant le script de changement :

Code:

---

1 2 3 4 5 6 7 8 9

<table id="tab_chapitre" width="490" height="151" background="../../gfx/e/e_chapitre.jpg" style="background-repeat:no-repeat" border="0" cellpadding="0" cellspacing="0"> <tr> <td width="119" height="151" valign="middle" class="bulle"> <!-- DEBUT bulle --> ####### <!-- FIN bulle --> </td> </tr> </table>

---

Le problème est qu'une fois que j'ai modifié le background image, le style background-repeat est perdu dans IE et pas dans Mozilla!

donc je fais aussitot ça pour le remettre :

Code:

---

<script>document.getElementById('tab_chapitre').style.background='no-repeat';</script>

---

mais j'ai une erreur javascript qui me dit que ça fonctionne pas :

Citation:

---

Error: invalid assignment left-hand side
Source File: http://127.0.0.1/sicae2/site/entreprise/e_histo.php
Line: 121, Column: 63
Source Code:
document.getElementById('tab_chapitre').style.background-repeat='no-repeat';

---

une idée ?

Bonjour,
c'est parce que style.background est en fait un raccourcis regroupant plusieurs style (optionnels point de vue syntaxe).
Pour ton erreur, pour une fois le debugger te souffle la bonne syntaxe :

Code:

---

document.getElementById('tab_chapitre').style.background-repeat='no-repeat';

---

(sauf qu'en JS, ça s'écrit backgroundRepeat)
Mais pour ne pas avoir à le retoucher à chaque fois, il suffit de ne modifier effectivement que l'image

Code:

---

document.getElementById('tab_chapitre').style.backgroundImage=url(../../gfx/e/e_chapitre_news.jpg);

---

(d'ailleur, faut pas de quotes)

A+

merci.
j'ai pas eu le temps de tester ta solution car je viens d'en trouver un autre : écrire les 2 opérations en une fois :

Code:

---

<script>document.getElementById('tab_chapitre').style.background='url(../../gfx/e/e_chapitre_news.jpg) no-repeat';</script>

---

et ça marche dans IE et Mozilla, donc "à la bonne heure" comme dit ma grand-mère...
et encore merci pour ton autre idée

Pas de quoi :D

Seul warning : en faisant comme ça, en plus de redéfinir une propriété qui l'est déjà, tu auras le même pb si tu décidais de définir les background-attachment (Effet de filigrane) et background-position ...
Le background (tout court) est efficace pour définir toutes ces prop d'un coup au départ. Par la suite, autant ne toucher qu'à celles qui sont modifiées ...

A+