AIDEZ MOI : texte defilant html ?

Fermé
vrompir - 18 janv. 2002 à 10:44
 TigerJim1994 - 6 janv. 2009 à 15:35
Salut,
voila y' a un truc que j'aimerai faire mais je sais pas du tout comment, je pense qu'il fo du javscript ou quelque chose du genr mais j'en suis pas sure ...
j'explique

j'ai une image dans un layer et un autre layer sur cette image qui contient du texte....en bas de l'image se trouve 2 petits boutons, (haut/bas) qui permettent de faire defiller le texte qu'il y a dans le second layer de texte comme une scrollbar ...

je sais pas comment faire et toute aide serait la bienvenue ...

14 réponses

PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 606
19 janv. 2002 à 20:19
Salut vrompir,

J'suis pas sûr d'avoir tout compris ...

Cependant voici un ex en Javascript qui répondra peut être à tes besoins.
Peut être JAVA ou FLASH seraient ils mieux appropriés mais comme je ne connais ni l'un ni l'autre ...

Copie ce qui suit dans un fichier html sur ton PC et test avec IE

<html>
<head>
<style>

.stylecadre
{
position:absolute;
overflow:hidden;
background-color:#E0E0E0;
}

.styletexte
{
position:absolute;
left:5px;
top:0px;
overflow:hidden;
}

.perso
{
font-family:arial;
font-weight:bold;
font-size:10pt;
color:#0000BB;
}
</style>
<script language="Javascript">
<!--
var fenetre=null


// Object qui va référence un layer <DIV> HTML positionner de manière absolue de préférence
function DivObject(id)
{
this.ref=window.document.getElementById(id);

}

// Définir les dimensions de l'object DIV référencé
function divObject_setSize(szX,szY)
{
this.setWidth(szX)
this.setHeight(szY)
}
DivObject.prototype.setSize=divObject_setSize

// Définir la position absolue de l'object DIV référencé
function divObject_setPos(x,y)
{
this.setX(x)
this.setY(y)
}
DivObject.prototype.setPos=divObject_setPos

// Pas utilisé ...
function divObject_setClip(x,y,szX,szY)
{
this.ref.style.clip="rect("+y+","+szX+","+szY+","+x+")";
}
DivObject.prototype.setClip=divObject_setClip

// Définir la largeur de l'object DIV référencé
function divObject_setWidth(szX)
{
this.ref.style.width=szX+"px"
}
DivObject.prototype.setWidth=divObject_setWidth

// Définir la hauteur de l'object DIV référencé
function divObject_setHeight(szY)
{
this.ref.style.height=szY+"px"
}
DivObject.prototype.setHeight=divObject_setHeight

// Modifier la position horizontale du delta passé dans dx
function divObject_setdX(dx)
{
dx+=this.ref.offsetLeft;
this.ref.style.left=dx+"px"
}
DivObject.prototype.setdX=divObject_setdX

// Modifier la position verticale du delta passé dans dy
function divObject_setdY(dy)
{
dy+=this.ref.offsetTop;
this.ref.style.top=dy+"px"
}
DivObject.prototype.setdY=divObject_setdY

// Définir la position horizontale de l'object DIV référencé
function divObject_setX(x)
{
this.ref.style.left=x+"px"
}
DivObject.prototype.setX=divObject_setX

// Définir la position verticale de l'object DIV référencé
function divObject_setY(y)
{
this.ref.style.top=y+"px"
}
DivObject.prototype.setY=divObject_setY


// Création des objects nécessaire au chargement
function load()
{
// D'abord la zone cadre qui va servir de support à la zone de texte
zonecadre=new DivObject("cadre");
// On définit ensuite les dimensions de la zone de cadres
zonecadre.setSize(180,250);
// Puis sa position
zonecadre.setPos(10,100);

zonetexte=new DivObject("texte");
}



// Tout le code Javascript qui suit ne sert que pour le scroll automatique ...


// name : le nom de la variable javascript déclarée comme objet de type DivObject
// direction : "UP", "DOWN", "LEFT" ou "RIGHT"
// start : mettre à zéro (pas utilisé)
// end : valeur qui met fin au scrolling lorsque la coordonnée x ou y de l'objet DIV référencé atteind ou dépasse cette valeur
// step : pas entre 2 déplacements
// time : durée en milliseconde entre 2 appels au timer
function divObject_scrollStart(name,direction,start,end,step,time)
{
// Si déjà un timer en cours on sort ..
if (this.timerMove) return;

this.step=step
this.start=start
this.end=end
this.name=name
this.time=time
this.timerMove=null
this.direction=direction

// Lance le timer
if (!this.timerMove) this.timerMove=setInterval(this.name+".move()",this.time);
}

DivObject.prototype.scrollStart=divObject_scrollStart

function divObject_move()
{
stop=true

switch (this.direction)
{
case "UP" :
if (this.ref.offsetTop >= this.end)
{
stop=false
this.setdY(-this.step)
}
break;

case "DOWN" :
if (this.ref.offsetTop <= this.end)
{
stop=false
this.setdY(this.step)
}
break;

case "LEFT" :
if (this.ref.offsetLeft >= this.end)
{
stop=false
this.setdX(-this.step)
}
break;

case "RIGHT" :
if (this.ref.offsetLeft <= this.end)
{
stop=false
this.setdX(this.step)
}
break;
}

if (stop) this.scrollStop()
}
DivObject.prototype.move=divObject_move



function divObject_scrollStop()
{
if (this.timerMove) clearInterval(this.timerMove);
this.timerMove=null
}
DivObject.prototype.scrollStop=divObject_scrollStop


// -->
</script>

</head>
<body onload="load()">

<form>
<table>
<tr>
<td>
<fieldset><legend>Remote control</legend>
<input type="button" value="Gauche" onclick="zonetexte.setdX(-10)">
<input type="button" value="Droite" onclick="zonetexte.setdX(10)">
<input type="button" value="Haut" onclick="zonetexte.setdY(-10)">
<input type="button" value="Bas" onclick="zonetexte.setdY(10)">
<input type="button" value="R.a.z" onclick="zonetexte.setPos(5,0)">
</fieldset>
</td>
<td valign=center>
<fieldset><legend>Défilement auto</legend>
<input type="button" value="Start" onclick="zonetexte.scrollStart('zonetexte','UP',0,-140,2,100)">
<input type="button" value="Stop" onclick="zonetexte.scrollStop()">
</fieldset>
</tr>
</table>
</form>

<div id="cadre" class=stylecadre>&nbsp;
<div id="texte" class=styletexte>
<p class=perso nowrap>
Salut vrompir<br><br>
Ce texte est contenu dans un layer appelé "texte" lui même contenu dans un autre layer (en gris) appelé "cadre".<br>
Le contenu du layer "texte" ne peut pas sortir de la zone délimitée par le layer "cadre" qui peut très bien être une image.<br><br>
Clique sur <font color=#FF0000>[Start]</font> pour faire automatiquement défiler ce texte vers le haut.<br><br>
N'oublie pas de cliquer ensuite sur [Stop] pour mettre fin au timer ...<br><br>
Php<br><br>
[[ The Truth is Out There ]]</p>
</div>
</div>

</body>
</html>


Si tu as un pb par rapport au code, laisse un msg ;:)

@+
Philippe

[[  The Truth is Out There   ]]
3
RAD ZONE Messages postés 5224 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 22 mars 2024 1 353
4 janv. 2008 à 00:01
JE REPETE "MARQUEE" n existe pas

il faut du javascript http://www.editeurjavascript.com/scripts/search.php?asked=texte+defilant&dest=1

mais bon puisque plus on dis "ne faite pas ca " plus il y en as qui font le contraire !!!

RAD
2
RAD ZONE Messages postés 5224 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 22 mars 2024 1 353
25 avril 2008 à 18:37
De toute les façons c'est microsoft qui detient les 90%du marche informatique
alors marche avec leur language.


encore une belle connerie !!!!!

microsoft n est pas proprietaire du web !!!!

et 90% des particuliers on microsofts mais cela ne veux pas dire que tous utilise la m....de Internet explorer pour naviguer !!!

et ce n est pas microsoft qui decide des standart web !! et heureusement !!


RAD
2
J'ai beaucoup plus facile ! Sans javascript ..

<marquee>Texte ici</marquee>
1

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
j te remercie , mais ce que je veux c 'est ca , je veux un titre par exemple "la france" qu m 'affiche sur la page d'accueil lettre par lettre comme suit: l puis a puis f puis r puis.....
ce que ta proposé on peut l faire avec la balise marquee
j espere ta d' autres idees j te remercie bcq
1
Comme un texte de machine a écrire ? Si c'est le cas, voici un script JavaScript qui fera l'affaire : http://ww38.easy-script.com/scripts-Javascript/un-texte-de-machine-a-ecrire-109.html
0
Désolé de te contredire mais "MARQUEE" fonctionne très bien sous firefox!
Faut arrêter de prendre Sun pour des débutants sérieux :-(
1
RAD ZONE Messages postés 5224 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 22 mars 2024 1 353
5 août 2007 à 11:08
SALUT
J'ai beaucoup plus facile ! Sans javascript ..

<marquee>Texte ici</marquee>


sur IE :-)))

je rapel que la balise "MARQUEE" n existe pas !!!!!!!!!!!! c est une invention microsoft ( ou netscape ? je me rapel plus )!!

donc utilisation js ou java ou flash !!

RAD
0
la balise <marquee> fonctionne aussi sous firefox

mais comment faire pour que le mouvement s'arrete quand on passe la souris dessus???
0
utulise marquee un point c'est tout


<marquee>ton texte ici</marquee>
et ca marche.
De toute les façons c'est microsoft qui detient les 90%du marche informatique
alors marche avec leur language.
0
toi non plus RAD. ravale ta langue et utilise donc marquee.
0
Flow31- Messages postés 84 Date d'inscription mardi 20 mai 2008 Statut Membre Dernière intervention 10 avril 2013 10
29 oct. 2008 à 11:57
Coucou,

Je sais que c'est pas du tout le BON sujet, mais je préfère me faire engueuler(me tuer pas quand même) que créer un topic (au pire je le créé quand même...)

Je ne peux pas utiliser marquee, comment je fais? parce que là où je veux l'utiliser, c'est sur facebook(désolé) et le HTML ne marche pas :(

Merci d'avance :D
0
Flow31- Messages postés 84 Date d'inscription mardi 20 mai 2008 Statut Membre Dernière intervention 10 avril 2013 10
20 nov. 2008 à 18:23
Sun = ????

Ensuite le site n'est PAS en [b]HTML/b
Que j'utilise firefox ou non, ce n'est pas la question, une page non html ne peut pas affiché "marquee" car celui ci appartient au langage HTML...
Tu ne m'as pas compri !
0
justedepassage
24 nov. 2008 à 19:46
Et bé.... que de bêtises "marquées" :D

En effet, si vous voulez mettre un site-torchon en ligne, utilisez-donc la balise marquee, vous en êtes libre. Cependant, comme le dit RAD, ce n'est pas un standard. Donc, faites ce que vous voulez pour vous mais ne conseillez pas ces absurdités pour d'autres personnes. Les standards du Net, les normes W3C, le HTML Strict, etc, sont des normes qui permettent à un site d'être accessible à une multitude d'utilisateurs. Vous devez vraiment avoir de la veine de ne pas être malvoyant sinon vous comprendrez vraiment ce qui est écrit dans ce message...

Bref, utilisez la balise mais ne venez pas vous plaindre ensuite si l'accessibilité de votre site est décrié par la suite. C'est ce genre de détails et de possibilités offertes aux internautes qui différencient un site d'amateurs d'un site professionnel ou d'aspect professionnel.

Au final, il reste la solution du javascript (mais gare aux utilisateurs l'ayant désactivé) ou en flash (mais ce point aussi est difficile au niveau de l'accessibilité).

De plus, dans le Web 2.0, le fait de respecter les normes permet d'être ajouté dans les petits papiers des internautes qui prendront des nouvelles de votre site via des flux ou des outils récupérant les infos pour suivre l'actu proposée par le site.
0
justedepassage
24 nov. 2008 à 19:55
>Flow31
>Je ne peux pas utiliser marquee, comment je fais? parce que là où je veux l'utiliser, c'est sur facebook(désolé)
>et le HTML ne marche pas :(

Facebook doit peut-être permettre uniquement du BBcode, un code allégé en somme. C'est utilisé pour éviter les mauvaises actions que l'on pourrait réaliser avec du code HTML. Donc, il est impossible de faire défiler du texte en BBcode tant que ce n'est pas géré dans ce "langage".
0
jaimerai faire un texte qui defile sur le fon dune musique mais je nai aucune idee de comprend faire jaimerai de l'aide
merci de me rep le plu vite possible
0
Pour le BBcode la balise (si elle est dans les memes normes que les forums forumactifs) est [scroll]/scroll
0