Insertion image dans un message roulant

**FromHell04** · 25/01/2012, 14h37

Bonjour all,

Comme le titre indique je veux remplacer || par une image, voici le code que j'utilise (il fonctionne parfaitement

):

Code JavaScript :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
var position=0;
var B ="  ||  "
var msg="1ere message"+B+"2eme message"+B;
var longue=100
var fois=(70/msg.length)+1;
for(i=0;i<=fois;i++) msg+=msg;
function textdefil() {
document.form1.deftext.value=msg.substring(position,position+190);
position++;
if(position == longue) position=0;
setTimeout("textdefil()",100);
}
window.onload = textdefil;

et voici mon code HTML :

Code :

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

1
2
3
4
5
<body>
<form name="form1">
<textarea type="text" name="deftext" rows="20" cols="200" color="#FFFF00"></textarea>
</form>
</body>

Le message qui s'affiche dans l'écran : "1ere message || 2eme message || 1ere message || 2eme message ...." et ainsi de suite

Merci D’Avance,

**SpaceFrog** · 25/01/2012, 14h53

Code :

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

var B ='<img src="tonimage;png" alt="" />';

**FromHell04** · 25/01/2012, 15h02

Il m'affiche :
1ere message <img src="x.png" alt="" /> 2eme message ...
comme s'il ne converti pas les balise html

**SpaceFrog** · 25/01/2012, 15h09

ha dans un textarea ..

pas possible, mets un div à la place

**FromHell04** · 25/01/2012, 15h22

Aaaaah

J'ai changer le code HTML en :

Code :

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

1
2
3
4
5
<body>
<form name="form1">
<div name="deftext"></div>
</form>
</body>

et une erreur s'affiche :

'document.form1.deftext' a la valeur Null ou n'est pas un objet.

Dsl mais je ne suis pas très expérimenté en JAVASCRIPT

**SpaceFrog** · 25/01/2012, 15h31

Code :

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

1
2
3
4
5
<body>
 
<div id="deftext"></div>
 
</body>

Code :

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

1
2
document.getElementById('deftexte').innerHTML=msg;
document.getElementById('deftexte').style.marginLeft=document.getElementById('deftexte').style.marginLeft-5

et quand tu arrives au marginLeft lax tu le remets à 0

**FromHell04** · 25/01/2012, 16h14

la même erreur s'affiche :/

'document.getElementByID(...)' a la valeur Null ou n'est pas un objet.

pour la ligne :

Code :

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

document.getElementById('deftexte').innerHTML=msg;

Désoler vraiment, mais je n'ai aucune idée pour ses erreur.

**SpaceFrog** · 25/01/2012, 16h18

heu tu as bien un div avec id deftext dans ta page ...

**FromHell04** · 25/01/2012, 16h32

Merci beaucoup SpaceFrog

voila le code javascript :

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
<script language="JavaScript">
var position=0;
var B ='<img src="X.png" alt="" />';
var msg="1ere message"+B+"2eme message"+B;
var longue=100
var fois=(70/msg.length)+1;
for(i=0;i<=fois;i++) msg+=msg;
function textdefil() {
document.getElementById('deftext').innerHTML=msg;
document.getElementById('deftext').style.marginLeft=0;
position++;
if(position == longue) position=0;
setTimeout("textdefil()",100);
}
window.onload = textdefil;
</script>

Mais il y a un petit problème c'est que le message ne défile pas

**SpaceFrog** · 25/01/2012, 16h53

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
29
30
31
32
33
34
<!DOCTYPE html>
<html lang="fr">
<head>
	<meta charset="UTF-8" />
 
<script language="JavaScript">
var position=0;
var B ='<img src="X.png" alt="" />';
var msg="1ere message"+B+"2eme message"+B;
var longue=100
var fois=(70/msg.length)+1;
for(i=0;i<=fois;i++) msg+=msg;
 
function textdefil() {
document.getElementById('deftext').style.marginLeft=parseInt(document.getElementById('deftext').style.marginLeft,10)-2;
if(position == longue) position=0;
setTimeout("textdefil()",200);
}
 
function init(){
document.getElementById('deftext').style.marginLeft=0;
document.getElementById('deftext').innerHTML=msg;
textdefil();
}
 
</script>
    <style type="text/css">
html, body {width:100%;}
</style>
</head>
<body onload="init();">
<div id="deftext">h</div>
</body>
</html>

Insertion image dans un message roulant

JavaScript

Discussions similaires

Partager

Partager