défilement de texte

Version imprimable

Voir 40 message(s) de cette discussion en une page

08/04/2008, 09h07
sinifer

ok
merci auteur

par contre je suis désolé pour l'orthographe mais c'est pas ma branche lol

je vais tout mettre en place le code que tu ma donnée et je te fais signe ;)
08/04/2008, 09h56
sinifer

désolé mais j'ai un petit problème :roll:

quant je place :

Code:

<div class="coneneur" id="coneneur">

il y a

Code:

<div id="conteneurlog">

qui n'est plus lue donc mon css ne marche et je comprend pas pourquoi??
08/04/2008, 10h16
sinifer

:lol:

désolé je me suis pri la tête depuis ce matin a cause d'oublie du div :aie:
tous marche impécablement et encore désolé du dérengement
bonne journée
08/04/2008, 11h29
Auteur
Citation:

Envoyé par sinifer

désolé mais j'ai un petit problème :roll:

quant je place :

Code:

<div class="coneneur" id="coneneur">

il y a

Code:

<div id="conteneurlog">

qui n'est plus lue donc mon css ne marche et je comprend pas pourquoi??

surtout que c'est conteneur et pas coneneur :aie:
Code:

1 2 3 4 5 <div class="conteneur" id="conteneur"> </div>
Si tu changes le nom de la classe et l'id il faut réaliser les même modifications dans la feuille de styles et le script : remplacer conteneur par conteneurlog.

Mais visiblement tu as corrigé le problème ;)
09/04/2008, 09h05
sinifer

oui merci mais comme j'ai aussi conteneur comme css j'ai dû changer le nom et je l'ai fait pour tous le code que tu ma donné :king:
j'avais oublié de mettre le div a la fin c'estai pour sa
j'ai vu ton mots sur l'autre message je vais mettre tous sa en place et si j'ai ouvert une nouvel discution c'est que je voulais pas t'en demandé trop te laissé un peu reposé ;)
10/04/2008, 08h58
sinifer

hhheeeeuuuuu :roll:

rebonjour je vien de voir un ptit problème sa marche pas sous firefox le text défile mais pas l'image ????

Citation:

Envoyé par sinifer

hhheeeeuuuuu :roll:

rebonjour je vien de voir un ptit problème sa marche pas sous firefox le text défile mais pas l'image ????

:koi:

- Tu as bien quelque chose qui ressemble à ceci au début de ton code :
Code:

1 2 3 4 5 6 var chemin = "images\\"; var tabImg = new Array("i1.gif","i2.gif","i3.gif","i4.gif","i5.gif"); var tabTxt = new Array("Image 1", "Voici un long, terriblement long et ennuyeux commentaire sur l'image2", "Image3", "Image4", "Image5"); var attente = "3000"; //délai d'affichage d'une image en ms
:question:

- Tu as modifié les fonctions du diaporama (creationDiaporama, deroule, defileImage et stopDiaporama) ou l'une de ses variables ?

10/04/2008, 11h01
Matthieu2000

J'ai vu des images qui défilent...
http://www.escrime-info.com/
pas trop le temps de lire le code.
10/04/2008, 12h06
sinifer

non je n'ai rien changé j'ai laissé tel quel
10/04/2008, 14h58
Auteur

Citation:

Envoyé par sinifer

non je n'ai rien changé j'ai laissé tel quel

montre moi ton code JS et HTML... Tu ne t'est pas trompé dans le chemin des images ?

voila mon code html de la page

si jamais il se trouve sous mon code php

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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
 
<!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">
<head>
<title>Inergy</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link href="css.css" rel="stylesheet" type="text/css" />
<script src="Scripts/defilement.js" type="text/javascript"></script>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body onload="creationDiaporama()" onunload="stopDiaporama()">
<div id="conteneur">
  <div id="header"></div>
<div id="haut">
 
        <div class="logo">
          <?php include("logo.php") ?>
        </div>
    <div class="menu">
      <script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','635','height','131','src','flash/inergy3?button=1','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','flash/inergy3?button=1' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="635" height="131">
        <param name="movie" value="flash/inergy3.swf?button=1" />
        <param name="quality" value="high" />
        <embed src="flash/inergy3.swf?button=1" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="635" height="131"></embed>
      </object>
    </noscript></div>
    <div class="xerox"><img src="img/logo-xerox.jpg" alt="" width="86" height="39" /></div>
</div>
  <div class="ban">
    <table width="989" height="27" border="0" cellpadding="0" cellspacing="0">
 
      <tr>
        <td width="209"><span class="titrerouge">Contact Inergy</span><br />
          Inergy SA<br />
          12, Av. des Morgines<br />
          1213 Petit-Lancy / Gen&egrave;ve<br />
          <table width="167" height="16" border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td><strong>TEL.</strong></td>
              <td>022 / 394 94 40</td>
            </tr>
            <tr>
              <td><strong>Fax</strong></td>
              <td>022 / 301 71 50</td>
            </tr>
            <tr>
              <td><strong>MAIL</strong></td>
              <td>bienvenue@inergy.ch</td>
            </tr>
          </table>
          <br />
          <p><img src="img/ligne-rose.jpg" alt="" width="173" height="9" /></p>
          <p class="titrerouge">Assistance Xerox</p>
          <table width="167" height="16" border="0" cellpadding="0" cellspacing="0">
            <tr>
              <td><strong>FR</strong></td>
              <td>043 / 299 90 01</td>
            </tr>
            <tr>
              <td><strong>ALL</strong></td>
              <td>043 / 299 90 00</td>
            </tr>
          </table>
          <br />
          <p><img src="img/ligne-rose.jpg" alt="" width="173" height="9" /></p>
          <p><br />
          </p></td>
        <td width="780"><img src="img/ban-home.jpg" alt="" width="779" height="277" /></td>
      </tr>
    </table>
    <map name="Map" id="Map2">
      <area shape="rect" coords="116,6,187,97" href="produits.php" alt="" />
    </map>
  </div>
 
  <div id="centre">
    <p>&nbsp;</p>
    <table width="998" height="50" border="0" cellpadding="0" cellspacing="0">
      <tr>
 
        <td width="255" rowspan="3" valign="top" class="bloc"><p class="titreblanc">ACTUALITES</p>
       <div class="blocdefilement"> 
	   			<?php
 
    if(file_exists('test.txt'))
   {
            $lignes = file('test.txt');
            $n       = 0; 
			$bb = "";
			$ss = '<br />';
 
 
            $lignes = array_slice($lignes, $n, $n+100); 
 
            foreach($lignes AS $valeur)
           {
				$bb = $bb.$ss.$valeur;
           }
   }
           		   ?>
	<marquee scrollamount="3" loop="auto" direction="up" onmouseover="this.stop()" onmouseout="this.start()" >
		<?php echo $bb,'<br />'; ?></marquee>
            <?php 
?>
		</div>
        <td width="255" rowspan="3" valign="top" class="bloc"><p class="titreblanc">A LA UNE</p>
        <div class="coneneur" id="coneneur">
 
     </div>
        <td width="255" rowspan="3" valign="top" class="bloc"><p class="titreblanc">SHOP ONLINE</p>
        <p>24 heures sur 24, 7 jours sur 7<br />
          et 366 jours par an c'est plus de<br />
          6'500 articles de toute marque<br />
          &agrave; prix discount<br />
          <br />
          <span class="Style3">&bull; <span class="Style7"><a href="#">xxx.pdf</a></span><br />
&bull; <span class="Style8"><a href="#">xxx.pdf</a></span></span></p></td>
        <td width="233" valign="top" class="bloc"><p class="titreblanc">RESSOURCES UTILES</p>
        <p><span class="Style3">&bull;</span> &eacute;v&eacute;nement &amp; presse<br />
          <span class="Style3">&bull;</span> assistance &amp; pilotes<br />
          <span class="Style3">&bull;</span> nous trouver<br />
          <span class="Style3">&bull;</span> relev&eacute; compteurs<br />
          <span class="Style3">&bull;</span> conditions g&eacute;n&eacute;rales<br />
          <span class="Style3">&bull;</span> account management</p></td>
      </tr>
      <tr>
        <td>&nbsp;</td>
      </tr>
      <tr>
        <td valign="top" class="bloc"><p class="titreblanc">A PROPOS D'INERGY</p>
        <p><span class="Style3">&bull;</span> entreprise<br />
          <span class="Style3">&bull;</span> environnement, sant&eacute; &amp; s&eacute;curit&eacute;<br />
          <span class="Style3">&bull;</span> sponsoring &amp; partenariat<br />
          <span class="Style3">&bull;</span> emploi<br />
          <br />
        </p></td>
      </tr>
    </table>
    <br />
  </div>
 
  <div id="pied"></div>
</div>
<div id="idTest"></div>
</body>
</html>

et le code js :

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
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
 
// JavaScript Document
<!--
/* 
chemin => chemin relatif des images
tabImg => nom des images
tabTxt => légende des images
*/
 
var chemin = "images\\";
var tabImg = new Array("i1.gif","i2.gif","i3.gif","i4.gif","i5.gif");
var tabTxt = new Array("Image 1", "Voici un long, image2", "Image3", "Image4", "Image5");
 
var attente = "3000"; //délai d'affichage d'une image en ms
 
 
// Action à réaliser lors du clic sur une cellule. 
// id est de la forme "celluleX" avec X compris entre 0 et tabImg.length-1
function clicSurImage(objCellule)
{
	//alert(objCellule.id);
	switch (objCellule.id)
	{
		case "cellule0": // pour la 1ère image
			document.location.href = "http://www.developpez.net/forums/showthread.php?t=519736";
			break;
		case "cellule1": // pour la 2nde image
			document.location.href = "produits.php";
			break;
		case "cellule2": // pour la 3ère image
			document.location.href = "http://www.developpez.net/forums/showthread.php?t=519736";
			break;
		case "cellule3": // pour la 4nde image
			document.location.href = "http://www.google.fr/";
			break;
		case "cellule4": // pour la 5nde image
			document.location.href = "http://www.google.fr/";
			break;		
	}
}
 
 
/*********************************************************/
//***** Fonctions du diaporama *****//
var tempo = "1";
var pas = 2;
var chrono;
var posFin, coneneur, sens;
 
// Ajout des images et du texte dans le div coneneur
function creationDiaporama()
{
	var i;
	var imgDiapo, txtDiapo, crlf;
	var coneneur = document.getElementById("coneneur");
 
	// Création du tableau contenant les élements
	var elTable = document.createElement("table");			
	// Ajout d'une ligne dans ce tableau
	var elLigne = elTable.insertRow(-1);
	var elCell;
 
	elTable.style.width = parseInt(coneneur.clientWidth * tabImg.length) + "px";
	elTable.cellSpacing = "0";
	elTable.cellPading = "0";
 
	for (i=0; i<tabImg.length; i++)
	{
		// Création du noeud image
		imgDiapo = document.createElement("img");
		imgDiapo.src = chemin+tabImg[i];
		imgDiapo.className = "image";
 
		// Création du saut de ligne
		crlf = document.createElement("br");
 
		// Création du noeud texte
		txtDiapo = document.createTextNode(tabTxt[i]);
 
		// Création de la cellule contenant les objets
		elCell = elLigne.insertCell(i);
		elCell.className = "cellule";
		elCell.id = "cellule"+i;
		elCell.objetCellule = elCell;
		elCell.onclick = function(){clicSurImage(this.objetCellule);}
 
		// Ajout des éléments dans la cellule
		elCell.appendChild(imgDiapo);
		elCell.appendChild(crlf);
		elCell.appendChild(txtDiapo);
	}
 
	// Ajout du tableau dans le div coneneur
	coneneur.appendChild(elTable);
	chrono1 = setTimeout("deroule()",attente);
} 
 
// Détermination du sens de défilement des images et des distances à parcourir
function deroule()
{
	var distance;
 
	coneneur = document.getElementById("coneneur");
	distance = coneneur.scrollWidth / tabImg.length;
 
	if (coneneur.scrollLeft + distance >=coneneur.scrollWidth)
	{
		sens = -1;
	}
 
	if (coneneur.scrollLeft<distance)
	{
		sens = 1;
	}
 
	posFin = coneneur.scrollLeft + sens * distance;
	chrono = setTimeout("defileImage()", tempo);
}
 
// Défilement des images
function defileImage()
{
	coneneur.scrollLeft = coneneur.scrollLeft + sens * pas;	
 
	if (sens == 1)
	{
		if (coneneur.scrollLeft<posFin)
			chrono = setTimeout("defileImage()", tempo);
		else
			chrono = setTimeout("deroule()",attente);
	}
	else
	{
		if (coneneur.scrollLeft>posFin)
			chrono = setTimeout("defileImage()", tempo);
		else
			chrono = setTimeout("deroule()",attente);
 
	}
		//affiche en bas la position
	/*document.getElementById('idTest').innerHTML=coneneur.scrollLeft + " / " + posFin; */
}
 
// Réinitialisation du diaporama lors de la fermeture de la page
function stopDiaporama()
{
	clearTimeout(chrono);
	document.getElementById("coneneur").scrollLeft = 0;
}

merci en tous cas

11/04/2008, 11h02
Auteur
Dans ta page HTML
Code:

1 2 3 <link href="css.css" rel="stylesheet" type="text/css" /> <script src="Scripts/defilement.js" type="text/javascript"></script>
et dans ton script Scripts/defilement.js :
Code:

1 2 var chemin = "images\\";
où se trouve ton dossier images ? Dans ton cas il doit se trouver dans le dossier Scripts.

Petite parenthèse : privilégie les minuscules dans les url et les différents chemins. Certains serveurs sont "case sensitive".
11/04/2008, 11h12
sinifer

Citation:

où se trouve ton dossier images ? Dans ton cas il doit se trouver dans le dossier Scripts

il se trouvai dans le www mais quand je l'ai mis dans le script sa marchais ni sur ie et firefox
11/04/2008, 11h35
Auteur
Citation:

Envoyé par sinifer

il se trouvai dans le www mais quand je l'ai mis dans le script sa marchais ni sur ie et firefox

le script tel que tu me l'as donné ci-dessus fonctionne sous IE mais pas sous FF ?

Essaye cette syntaxe (mais je doute que cela vienne de là) :
Code:

1 2 var chemin = "images/";
11/04/2008, 11h41
sinifer

ouai je te l'ai donnée tel quel
sa marche pas avec / :(
11/04/2008, 11h52
Auteur

Si j'ai bien compris le script fonctionne sous IE mais pas sous FF ? C'est curieux...

Ouvre ta page sous FF puis ouvre la console javascript (Outils->Console d'erreurs) et dis moi quelle est l'erreur générée.

c'est a ne rien comprendre aujourd'hui sa marche mais il y a quand même sa dans mes consoles d'erreure
mais je pense pas que c'est grave

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
 
 
Avertissement*: Erreur d'analyse de la valeur pour la propriété «*float*».  Déclaration abandonnée.
Fichier source*: http://127.0.0.1/inergy/css.css
Ligne*: 306
 
Avertissement*: Couleur attendue, mais «*none*» trouvé.  Erreur d'analyse de la valeur pour la propriété «*background-color*».  Déclaration abandonnée.
Fichier source*: http://127.0.0.1/inergy/css.css
Ligne*: 378
 
 
Avertissement*: Couleur attendue, mais «*#*» trouvé.  Erreur d'analyse de la valeur pour la propriété «*color*».  Déclaration abandonnée.
Fichier source*: http://127.0.0.1/inergy/css.css
Ligne*: 399
 
Avertissement*: Couleur attendue, mais «*#*» trouvé.  Erreur d'analyse de la valeur pour la propriété «*color*».  Déclaration abandonnée.
Fichier source*: http://127.0.0.1/inergy/css.css
Ligne*: 400
 
Avertissement*: Couleur attendue, mais «*#*» trouvé.  Erreur d'analyse de la valeur pour la propriété «*color*».  Déclaration abandonnée.
Fichier source*: http://127.0.0.1/inergy/css.css
Ligne*: 401
 
Avertissement*: Couleur attendue, mais «*#*» trouvé.  Erreur d'analyse de la valeur pour la propriété «*color*».  Déclaration abandonnée.
Fichier source*: http://127.0.0.1/inergy/css.css
Ligne*: 402
 
Avertissement*: Couleur attendue, mais «*#*» trouvé.  Erreur d'analyse de la valeur pour la propriété «*color*».  Déclaration abandonnée.
Fichier source*: http://127.0.0.1/inergy/css.css
Ligne*: 403

14/04/2008, 11h45
Auteur

Citation:

Envoyé par sinifer

c'est a ne rien comprendre aujourd'hui sa marche mais il y a quand même sa dans mes consoles d'erreure
mais je pense pas que c'est grave

ça ce n'est pas méchant (enfin pas vraiment), cela indique simplement que certaines propriétés CSS ne sont pas appliquées car les valeurs ne sont pas conformes.

Si ton script fonctionne aujourd'hui cela veut sans doute dire que tu avais oublié de vider ton cache avant de réouvrir ta page.
23/04/2008, 11h26
osia1

bonjour, ton code fonctionne super bien Auteur mais je voudrais savoir ce que je dois modifier pour que le scrolling se fasse de bas en haut...
Merci
29/04/2008, 00h44
King_T

Salut,
votre fonction marche a merveille ;)
Mais le probleme est que j'utilise la classe "Smarty" pour mon site
et je crois qu'elle sont incompatibles !!!!
j'ai même utilisé une <iframe> , mais ça ne donne rien.
bon, si vous avez une idée je tout ouïe :)

merci

Voir 40 message(s) de cette discussion en une page