Random Image en fond de tableau

Version imprimable

Bonjour à tous,
J'utilise la fonction suivante pour Randomiser une image au lancement d'une page. (Une image différente à chaque lancement.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 <script type="text/javascript" language="JavaScript">  //--> </script>
Là ou je veux afficher l'image j'utilise :
Code:

1 2 3 4 5 <script type="text/javascript" language="JavaScript"> printImage(); </script>
Cela fonctionnes très bien, mais je voudrais faire en sorte que cette image soit le fond d'un tableau. Quelqu'un pourrait-il m'aider ?

Rebonjour !
J'ai modifié le code comme ceci

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script type="text/javascript" language="JavaScript">
<!--
 
NumberOfImagesToRotate = 5;
 
 
FirstPart = '"Images/Fondentete/fondentete0';
LastPart = '.png"';
 
function printImage() {
var r = Math.ceil(Math.random() * NumberOfImagesToRotate);
 
document.getElementById('Entete1').style.backgroundImage=(FirstPart + r + LastPart); }
//-->
 
</script>

Avec dans le body onload l'appel à la fonction

Code:

<body onload="PrintImage();">

et l'affichage du tableau

Code:

1
2
3
4
5
6
7
8
9
10
<table align="center" id="Entete1"  >
  <tr align="center">
    <td height="175px" >
</td>
  </tr>
  <tr align="center">
    <td height="25px">&nbsp;</td>
  </tr>
 
</table>

apparemment je me gourre quelque part, mais je suis bloqué !

09/05/2011, 13h37
SpaceFrog

backgroundImage necessite une URL

Code:

objt.style.backgroundImage="url('"+ variable +"')";
09/05/2011, 13h43
Goltar

soit

Code:

document.getElementById('Entete1').style.backgroundImage=url(FirstPart + r + LastPart); }

?
Mais cela ne fonctionnes toujours pas :calim2:
09/05/2011, 13h45
SpaceFrog

un string !
09/05/2011, 13h58
Goltar

Code:

document.getElementById('Entete1').object.style.backgroundImage="url('"+FirstPart + r + LastPart+"')";

ceci est-il correct ?
09/05/2011, 14h03
SpaceFrog

syntaxiquement oui
après faut voir ce que donne ta concaténation de variables et si ça pointe sur un fichier image existant avec le bon path
09/05/2011, 14h08
Goltar

Le chemin est correct après avoir enlevé le double quote de mon FirstPart et de mon Lastpart.
Mais il s'obstine à ne pas afficher !

Aucun souci chez moi avec ce code:

Code:

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
<script type="text/javascript">
function foo(){
document.getElementById('tablo').style.backgroundImage="url('img/logo.gif')"
}
</script>
 
</head>
 
<body>
<input type="button" onclick="foo()" value="go" />
<table border="1" width="100%" id="tablo">
  <tr>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
  </tr>
  <tr>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
  </tr>
  <tr>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
  </tr>
</table>
 
</body>
 
</html>

Mon script me semble pourtant correct, le chemin aussi et les images existent.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script type="text/javascript" language="JavaScript">
<!--
 
NumberOfImagesToRotate = 5;
 
 
FirstPart = 'Images/Fondentete/fondentete0';
LastPart = '.png';
 
function printImage() {
var r = Math.ceil(Math.random() * NumberOfImagesToRotate);
 
document.getElementById('Entete1').style.backgroundImage="url('"+ FirstPart + r + LastPart +"')"; }
//-->
 
</script>

Code:

1
2
3
4
5
6
7
8
9
10
 <table align="center" id="Entete1" width="700px" height="175px" >
  <tr align="center">
    <td height="150px" >
</td>
  </tr>
  <tr align="center">
    <td height="25px">&nbsp;</td>
  </tr>
 
</table>

et onload

Code:

<body onload="PrintImage();">

09/05/2011, 14h32
Goltar

OK, j'ai trouvé
Probleme de casse

Dans mon onload j'appelais PrintImage() au lieu de printImage()

Merci pour ton aide
Problème résolu

Toujours pareil, aucin souci avec ce code:

Code:

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
43
<script type="text/javascript">
NOITR=5;
FirstPart="_";
LastPart=".png";
 
function foo(){
var r = Math.ceil(Math.random() * NOITR);
document.getElementById('tablo').style.backgroundImage="url('img/"+ FirstPart + r + LastPart +"')"
 
}
</script>
 
</head>
 
<body>
<input type="button" onclick="foo()" value="go" />
<table border="1" width="100%" id="tablo">
  <tr>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
  </tr>
  <tr>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
  </tr>
  <tr>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
    <td width="20%">&nbsp;</td>
  </tr>
</table>
 
</body>
 
</html>

Tu dois donc avoir un souci de path ...

[edit]
Bingo !
souci de cass=> path incorrect :yeah:
[/edit]