Fonction marquee sous Firefox

**Dsphinx** · 28/02/2007, 12h52

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 !

**jmjmjm** · 28/02/2007, 15h29

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.

**jmjmjm** · 28/02/2007, 15h31

Pour un defillement horizontal :

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
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 :

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
 
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);
}

**Dsphinx** · 28/02/2007, 15h32

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 ?

**jmjmjm** · 28/02/2007, 15h34

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 !!

**Dsphinx** · 28/02/2007, 15h55

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 :

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

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 !

**jmjmjm** · 28/02/2007, 17h08

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

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

**Dsphinx** · 01/03/2007, 08h46

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

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
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>

**MasterOfChakhaL** · 01/03/2007, 10h31

Salut,

Code :

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

<div id=\"marqueeV\">

Pourquoi échappe tu les ". Je pense que cela suffit à ce que ton id ne soit pas pris en compte.

**Dsphinx** · 01/03/2007, 10h42

merci... okay j'ai enlevé les \ mais le script ne fonctionne tjs pas...

**jmjmjm** · 01/03/2007, 11h21

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 :

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

window.onload=initMrqV();

La ca devrai marcher

**Dsphinx** · 01/03/2007, 11h24

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

**jmjmjm** · 01/03/2007, 12h46

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

)

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
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

**Dsphinx** · 01/03/2007, 15h27

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

Amicalement!

**jmjmjm** · 01/03/2007, 15h28

Mais de rien !! Le forum est fait pour ca !! Bonne continuation dans ton projet

**Dsphinx** · 01/03/2007, 16h47

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 :

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

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...

Fonction marquee sous Firefox

JavaScript

Discussions similaires

Partager

Partager