Forum d'entraide PHPFrance

Bonjour,

Alors, là, je sèche :s
ça consiste à faire défiler du texte dans une div.... (sans utiliser marquee bien sûr...)
Script JS :

function bandeau_defilant() {
	var texteDef = document.getElementById('bandeau_defilant').innerHTML;
	var texte = ' ';
	texteDef = texteDef.substring(1,texteDef.length);
	while(texteDef.length < 100) {
		texteDef += " " + texte;
	}
	document.getElementById('bandeau_defilant').innerHTML = texteDef;
	tempo2 = setTimeout("bandeau_defilant()", 90);
}

Code : Tout sélectionner

onload="bandeau_defilant();"

et mon div....

<div id="bandeau_defilant" style="width:660px; border:1px solid #000000; margin:auto;">Ceci est mon texte, mon texte, mon texte, mon texte, mon texte, mon texte, mon texte, mon texte, mon texte, mon texte.......</div>

Il défile bien mais.... il revient pas...

Merci à vous !

Bonjour,
est-ce que tu as compris le fonctionnement de ce script?
En gros le défilement est simulé, puisque la fonction ne fait qu'enlever la première lettre de ton conteneur, ce qui fait qu'on à l'impression qu'il "défile"...
Mais pour qu'il revienne, il faudrait déjà stocker quelque part le texte de départ, et ensuite, arriver à l'afficher depuis la droite, ce qui devient vite compliqué...
regarde de ce côté pour une autre solution:
http://www.phpfrance.com/forums/voir_su ... lant-0.php
(un petit lien: http://www.abciweb.net/defilant.php?page=250)

en fait non, j'ai pris ce script sur internet puisque je ne savais pas du tout comment m'y prendre...

j'ai rajouter:
var texteOrigine = document.getElementById('bandeau_defilant').innerHTML;
en haut pour "sauvegarder le texte"

mais pour le faire réapparaitre sur la droite... je vois pas trop comment

Merci !

Est-ce que c'est ça que tu veux ?

function bandeau_defilant() { 
    var texteDef = document.getElementById('bandeau_defilant').innerHTML; 
    texteDef = texteDef.substring(1,texteDef.length) + texteDef.substring(0,1); 
    document.getElementById('bandeau_defilant').innerHTML = texteDef; 
    tempo2 = setTimeout("bandeau_defilant()", 90); 
}

A chaque appel de la fonction (toutes les 90 millisecondes) la routine retire un caractère au texte et le replace à la fin.

Eric

Merci à toi !

Ah bah chez moi sous IE7 les espaces entre les mots sont supprimés au second passage du texte

J'ai pas cherché à corriger car ce genre de méthode produit un défilement très saccadé donc pénible à lire.

code testé

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans titre</title>
<script type="text/javascript">
function bandeau_defilant() { 
    var texteDef = document.getElementById('bandeau_defilant').innerHTML; 
    texteDef = texteDef.substring(1,texteDef.length) + texteDef.substring(0,1); 
    document.getElementById('bandeau_defilant').innerHTML = texteDef; 
    tempo2 = setTimeout("bandeau_defilant()", 90); 
} 
</script>
</head>
<body onload="bandeau_defilant()">
<div id ="bandeau_defilant"> Un essai de texte défilant </div>
</body>
</html>

Ah... pas l'habitude de regarder se que ça donne sous.... IE7 ^^

Par contre sous FireFox ça marche bien

Bizarre qu'il supprime les espaces...

Merci à vous tous !

Si tu remplaces tes espaces par des ' ' IE ne devrait plus les enlever

C'est encore pire

En fait, il fait comme htmlentities() sous PHP xD

essaies, tu verras bien ^^

Merci

Et dans le lien proposé par jojolapine, quelque chose ne te convient pas ? Certes la boucle ne réapparait qu'à la fin du message mais en contre partie l'affichage est beaucoup plus fluide...

Ah ça y est !
en persévérant d'avantage j'ai réussi à bien intégrer le code donné grâce au lien de jojolapine :
http://www.abciweb.net/defilant.php?page=250

Merci à vous tous

Ah ben merci de me faire de la pub

Je vois que ce petit utilitaire rend service

Sinon c'était pour dire qu'une fois que ton code est formaté, pour peu que tu n'aies que du texte à faire défiler, tu peux utiliser l'astuce suivante http://www.phpfrance.com/forums/voir_re ... php#204068 qui te permettra d'alimenter ton défilant avec un texte différent (provenant d'une bdd ou autre) sans avoir à modifier ton code

Loool
et ben depuis le début je peux modifier ce texte avec mon panel admin ^^

Merci quand même

@+

Loool
et ben depuis le début je peux modifier ce texte avec mon panel admin ^^

Merci quand même @+

M'oui... mais pour que le défilement soit parfait il faut adapter la largeur du div #defile (dans l'exemple) à la longueur du texte sinon le texte peut être tronqué ou la boucle mettre trop de temps à se ré afficher. Donc si tu changes la longueur de ton texte sans changer cette valeur tu auras des pb. C'est pour cette raison que je t'ai donné le lien plus haut

Ah ok

Merci

Forum d'entraide PHPFrance

Texte défilante dans un DIV

Texte défilante dans un DIV