Fonction marquee sous Firefox

Version imprimable

28/02/2007, 11h52
Dsphinx

Fonction marquee sous Firefox

Bonjour,

j'utilise une fonction marquee sous firefox cependant au chargement de la page on voit le texte qui défile sur le texte du site, ensuite il disparait pour faire le défilement ! Comment faire pour éviter que le texte s'affiche par-dessus le site ???
Merci !
28/02/2007, 14h29
jmjmjm

IL FAUT BANIR MARQUEE , pour plusieur raison pas comparible XHTML , presente des bug lors des passages de IE a Firefox, Moi pour le defillement horizontal ou vertical je passe par des foncions JavaScript assez simple.

Pour un defillement horizontal :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var pasH=1
 
function scrollmrqH(){
if ( parseInt(mrqH.style.left) > -l_mrqH )
mrqH.style.left = parseInt(mrqH.style.left)-pasH+"px"
else
mrqH.style.left=fenH.offsetWidth+"px"
}
 
function init_mrqH(){
mrqH=document.getElementById("marqueeH"); 
fenH=document.getElementById("CadreNews"); 
fenH.onmouseover=function(){stoc=pasH;pasH=0};
fenH.onmouseout=function(){pasH=stoc};
l_mrqH=fenH.offsetWidth;
with(mrqH.style){position="absolute";left=l_mrqH+"px";}
setInterval("scrollmrqH()",18);
}

et donc legerement modifier pour le defillement vertical sa donne :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
var pasV=1
 
function scrollmrqV(){
if ( parseInt(mrqV.style.top) > -h_mrqV )
mrqV.style.top = parseInt(mrqV.style.top)-pasV+"px"
else
mrqV.style.top=fenV.offsetHeight+"px"
}
 
function init_mrqV(){
mrqV=document.getElementById("marqueeV"); 
fenV=document.getElementById("SponsorCentre"); 
fenV.onmouseover=function(){stoc=pasV;pasV=0};
fenV.onmouseout=function(){pasV=stoc};
h_mrqV=mrqV.offsetHeight;
with(mrqV.style){position="absolute";top=fenV.offsetHeight+"px";}
setInterval("scrollmrqV()",28);
}

28/02/2007, 14h32
Dsphinx

Merci de ta réponse mais je vais quand meme passer par la fonction marquee car ce me prendra moins de temps que de tout refaire un javascript.

Revenons à la question: Y a t-il un moyen pour éviter que les textes se superposent au chargement de la page ?
28/02/2007, 14h34
jmjmjm

A toi de voir sachant que je te donne le code JavaScript tu n'as plus qu'a créé les bonnes balises div .

Sinon pour ta réponse désolé de ne pas t'avoir plus eclairé mais je ne me sert plus de marqee comme je te disais car il ma poser pas mal de probleme dont la plupar non pu etre résolu

Bon courage à toi !!
28/02/2007, 14h55
Dsphinx
En fait ca m'intéresse bien ton code ! J'explique le problème: J'ai du entre mes balise marquee du code php et il faudrait que je trouve qqch de similaire en javascript pour que je puisse remplacer facilement mes balises marquee:
Code:

1 2 3 4 5 6 7 8 9 <marquee> <?php bla bla bla bla bla ?> </marquee>
Je veux bien faire un défilement javascript mais je dois mettre mes balises php qui vont rechercher dans la BD mes textes ?

merci !
28/02/2007, 16h08
jmjmjm

c'est tout a fait possible voila un exemple d'utilisation dans un de mes programmes :

Citation:

<div id="marqueeH"><a href=".?Pg=Actualites"><?php echo"$News"; ?></a></div>

en fait tu remplace ta balise marquee par <div id=marquee(H ou V)>

Oki merci j'ai fais ceci mais ca ne fonctionne pas:

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
<html>
 
<body>
 
	<script type="text/javascript"> 
 
		var pasV=1
 
		function scrollmrqV(){
		if ( parseInt(mrqV.style.top) > -h_mrqV )
		mrqV.style.top = parseInt(mrqV.style.top)-pasV+"px"
		else
		mrqV.style.top=fenV.offsetHeight+"px"
		}
 
		function init_mrqV(){
		mrqV=document.getElementById("marqueeV"); 
		fenV=document.getElementById("SponsorCentre"); 
		fenV.onmouseover=function(){stoc=pasV;pasV=0};
		fenV.onmouseout=function(){pasV=stoc};
		h_mrqV=mrqV.offsetHeight;
		with(mrqV.style){position="absolute";top=fenV.offsetHeight+"px";}
		setInterval("scrollmrqV()",28);
		}
 
	</script>
 
	<div id=\"marqueeV\">
 
		Bla bla bla
 
	</div>
 
</body>
 
</html>

01/03/2007, 09h31
MasterOfChakhaL

Salut,

Code:

<div id=\"marqueeV\">

Pourquoi échappe tu les ". Je pense que cela suffit à ce que ton id ne soit pas pris en compte.
01/03/2007, 09h42
Dsphinx

merci... okay j'ai enlevé les \ mais le script ne fonctionne tjs pas... :aie:
01/03/2007, 10h21
jmjmjm

il faut que tu l'initialise je ne les pas mis avec la fonction car j'initialise tout mes script au meme endroit ajoute :

Code:

window.onload=initMrqV();

La ca devrai marcher :mouarf:
01/03/2007, 10h24
Dsphinx

Merci c'est sympa ! j'ai essayé mais ca ne marche pas... :cry:

autant pour moi, j'ai oublié un truc (si tu as firefox justement utilise la console d'erreur JavaScript ca aide beaucoup c dans outils)

POUR MRQ_H

il faut que tu cree deux balise DIV la premiere qui dans la fonction que je t'ai donnée s'appelle : "CadreNews" est le contenant c a elle que tu vas attribué les propriete CSS pour la couleur de fond , enfin toutes les propriete ....

La seconde marqueeH est le contenu tu n'as rien de special a lui specifier un exemple complet pour MRQ H :
(Un peu long car il y a les CSS et tout et tout :mouarf: )
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 <html> <head> <style type="text/css"> #CadreNews { position:relative; background-color:#fc0; overflow:hidden; height:40px; font:bold 16px Arial, Helvetica, sans-serif; line-height:40px; } #marqueeH { width:100%; } </style> <body> <div id="CadreNews"> <div id="marqueeH">toto</div> </div> </body> <script type="text/javascript"> var pasH=1 function scrollmrqH(){ if ( parseInt(mrqH.style.left) > -l_mrqH ) mrqH.style.left = parseInt(mrqH.style.left)-pasH+"px" else mrqH.style.left=fenH.offsetWidth+"px" } function init_mrqH(){ mrqH=document.getElementById("marqueeH"); fenH=document.getElementById("CadreNews"); fenH.onmouseover=function(){stoc=pasH;pasH=0}; fenH.onmouseout=function(){pasH=stoc}; l_mrqH=fenH.offsetWidth; with(mrqH.style){position="absolute";left=l_mrqH+"px";} setInterval("scrollmrqH()",18); } window.onload=init_mrqH(); </script> </html>
PS il faut initialiser la fonction que a la fin (javascript apres le code) car sinon il te dira qu'il n'as pas trouver tes balises DIV le mieux et de mettre ton JavaScript dans un fichier separer ainsi que le CSS tu seras moin embéter et se sera beaucoup plus propre.

En cas de probleme n'hesite pas a reposter je t'ai fait le MRQ_H C pareil pour le MRQ_V !!!
sauf que le div s'appelle "SponsorCentre" pour que se soitt plus logique tu peux renommer les div en ContenantH et COntenantV

01/03/2007, 14h27
Dsphinx

je l'ai modifié à ma guise ! Jmjmjm je te remercie beaucoup! Tout fonctionne!

Amicalement!
01/03/2007, 14h28
jmjmjm

Mais de rien !! Le forum est fait pour ca !! Bonne continuation dans ton projet
01/03/2007, 15h47
Dsphinx

Oui mais tout le monde ne réagit pas comme toi! Certains sont moins coopératifs... Enfin j'apporte un truc en plus, pour ceux qui veulent utiliser la fonction marquee et ne pas avoir ce problème d'affichage au chargement de la page... on peut insérer ces prioprétés dans la balise <marquee>:

Code:

style="overflow:hidden; height:20px;"

height:20px; evite au carde de s'agrandir au chargement de la page et overflow:hidden cache le texte qui s'affiche par dessus la page avant de défiler... Cette correction s'applique à Firefox et fonctionne aussi sous IE et Opéra...