Probleme de défilement d'image sur IE mais correct sur Firefox

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Probleme de défilement d'image sur IE mais correct sur Firefox

par Invité » 30 mai 2008, 13:26

Bon voila sa marche, merci pour votre aide.

Boro j'accepte tes excuses, mais t'inquiete si tu vois d'autres erreurs n'hésite pas a me le dire, si sa me permet de m'ameliorer, vos remarques sont les bienvenues ^^

Sinon pour l'histoire des paragraphes dans une ligne span, j'ai pas de problemes a l'affichage, que ce sois sur IE ou Firefox.. Peux etre un coup de chance, mais a l'avenir je vais faire attention ^^

par AB » 30 mai 2008, 04:00

Edit: Heu...des paragraphes (<p></p>) dans une ligne <span>..pas certain de la cohérence non plus... :oops:
Là tu as tout à fait raison, une balise de type "bloc" ne doit pas se trouver à l'intérieur d'une balise de type "en ligne" cela peut éventuellement jouer des tours à l'affichage.


@Ariochs si tu n'arrives pas à tes fins avec le script de Saik, reprend plutôt le script original http://www.phpfrance.com/forums/voir_re ... .php#79441 en modifiant simplement les éléments qui le font défiler horizontalement.
J'ai pas le temps de regarder en détail mais apparemment si tu remplaces defile.offsetWidth par defile.offsetHeight, et defile.style.left par defile.style.top , il devrait pas rester grand chose à faire.
Ensuite pour ajouter des fonctionnalités à ce script, lit la suite du topic.

par Victor BRITO » 30 mai 2008, 01:13

Quant à l'espace avant le slash dans les éléments vides en XHTML, elle ne sert qu'à la compatibilité avec les navigateurs anciens, afin qu'il les interprète correctement. D'ailleurs, en XML, cette espace est facultative.

par Boro64 » 30 mai 2008, 00:42

Oupssssss... :oops:
Autant pour moi! Très juste m'sieur Victor
Comme chantait l'autre "L'habitude nous joue des tours..."
Toutes mes excuses donc Ariochs
Je lirais plus attentivement la prochaine fois.. :wink:

par Victor BRITO » 30 mai 2008, 00:35

Les balises br et img sont des balises dites orphelines et s'écrivent donc:

Code : Tout sélectionner

<br /> et <img blablabla... />
(tu noteras l'espace avant le slash et la > )
En XHTML oui. Mais, pas en HTML 4. ;)

par Boro64 » 29 mai 2008, 22:34

Bonsoir
Puis je faire une remarque sur ton html?
Les balises br et img sont des balises dites orphelines et s'écrivent donc:

Code : Tout sélectionner

<br /> et <img blablabla... />
(tu noteras l'espace avant le slash et la > )
..Pardon pour l'intrusion si ça n'apporte rien au débat, mais tes balises n'étant pas fermées alors qu'auto fermante, il est possible (mais pas certain) que tu puisses avoir des erreurs d'interprétation de certains "navigateurs"... :? :-*
Bonne soirée
Edit: Heu...des paragraphes (<p></p>) dans une ligne <span>..pas certain de la cohérence non plus... :oops:

par Ariochs » 29 mai 2008, 12:53

Merci pour votre aide.

Je trouvais pas justelment par quoi remplacer MARQUEE, meme si il me genait pas trop, vu que sa fonctionné sur les IE et MOZILLA, juste le seul probleme etait que sur IE j'avais mes deux codes qui fonctionner. Mais effectivement je pense qu'avec la methode de Saik (en la mofifiant légerement) je devrais avoir un seul code pour les deux explorateurs, donc vais essayer ça cette aprem.

Merci encore pour l'aide

[EDIT] Bon alors effectivement le code donné par Saik fonctionne correctement (apres une petite modif), par contre je n'arrive pas faire tourner mes images en boucles. Quand la derniere image arrive tout en haut, sa ne repars pas, j'ai essayer different truc, mais j'ai pas du trouver le bon code.

Pouvez vous m'aider svp ? Voici le code actuel :


*js
<SCRIPT LANGUAGE="JavaScript">
var menu_defile;//l'élement a déplacer
var pscrnt = 210;//position verticale de départ
function texteDefile()
{
if (typeof this.sens == 'undefined')
this.sens = -1;
if(!menu_defile)
menu_defile = document.getElementById('menu_defile');
pscrnt += this.sens * 1;//sens * nb de pixel par déplacement
menu_defile.style.top = pscrnt+"px";
}
var timer = setInterval("texteDefile()", 30);//délai de deplacement
</SCRIPT>
*Body
<div class="menu_deroulant" onmouseover="clearInterval(timer)" onmouseout="timer=setInterval('texteDefile()', 30)">
<span id="menu_defile">
<p><a href="http://www.google.fr" target="blank" ><img src="img/logo_efs.jpg" width="155" height="210" border="none"></a></p>
<p><br>
<img src="img/logo_cciad.jpg" width="155" height="55" border="none"></p>
<p><br>
<img src="img/logo_dakar.jpg" width="155" height="194"><br>
</p>
</span>
</div>
*CSS
.menu_deroulant
{
height: 210px;
text-align: center;
overflow: hidden;
position: relative;
}

#menu_defile
{
position: relative;
}
En fait je vois pas ce qui faut marquer dans le JS pour lui dire de recomencer quand il a fini.. Si vous pouvez m'aider, sa serait sympa ^^. Merci

par AB » 28 mai 2008, 23:44

Une solution possible pour remplacer "marquee" se trouve dans ce topic http://www.phpfrance.com/forums/voir_re ... php#204068
J'ai fait une interface pour générer le code d'un défilement d'images horizontal mais dans le même topic Saik a donné une solution pour un défilement vertical. J'ai pas testé mais c'est peut-être une bonne piste.

par Victor BRITO » 28 mai 2008, 22:17

Soit dit en passant, l'élément MARQUEE n'est reconnu par aucune spécification HTML ou XHTML. Autrement dit, ce n'est pas un élément standard (si je me souviens bien, il s'agit d'un élément propriétaire d'Internet Explorer, élément survivant de l'époque de la "balkanisation du Web", où IE et Netscape se faisaient la guerre à coups d'éléments incompatibles avec le concurrent). En outre, le défilement d'un contenu (de quelque nature qu'il soit) pose un problème d'accessiblité (cas, par exemple, de personnes lisant très lentement et difficilement ou d'utilisateurs d'un lecteur d'écran incapable de restituer tout mouvement de contenu dans la page) ; dans ce cas, si tu tiens à ton défilement d'images, prévoie une fonctionnalité permettant de l'arrêter.

par animithra » 28 mai 2008, 21:56

Bonsoir.

Je ne saurais t'expliquer comment modifier exactement ton script pour qu'il fonctionne sur les deux navigateur, mais j'ai une question à te poser.

Apparemment tu as mis un if(navigateur == IE) dans ton code, pourquoi ne pas avoir placé l'autre partie dans un else ? comme ça cela n'afficherait qu'un seul code dans chaque cas ?

Bonne progra !

Probleme de défilement d'image sur IE mais correct sur Firef

par Ariochs » 28 mai 2008, 12:31

Bonjour.

Voila apres mon mon probleme du PHP je passe au petit probleme sur l'HTML que j'arrive vraiment pas a resoudre. Bon comme je debute en codage, je suis pas une bete et malheuresement je connais pas tout :( .

Enfin bon voila mon probleme. Tout fonctionne correctement sur Firefox, mais comme d'habitude sa foire sur IE. En fait j'ai fait une parti sur mon site, ou on retrouve des partenaires. Pour cela chaque partenaire est representer par son logo (donc une image) qui defile de bas en haut dans ma <div> partenaire.

Le probleme au debut etait que la 1ere image commence en bas, (et non pas direct en haut), donc pour cela j'ai mis des <br>. Maintenant sa fonctionne correctement sur firefox. Mais sur IE sa met 3 plombes a commencer, et 3 plombes a repartir.. Alors du coup j'ai voulu faire un code pour IE (qui marche tres bien) et un autre pour mozilla qui fonctionne tres bien aussi. Le seul hic, c'est que sur IE, y'a les deux codes qui fonctionne ensemble.. (enfin celui de mozilla commence en retard comme avant, et ce trouve tres bas dans mon site..).

Avez vous une petite idée pour corriger mon probleme ? Je vous montre mon code, peux etre que vous arriverez a trouver l'erreur pour que sur IE il n'y est que le code IE qui fonctionne.

<div id="partenaires">

<!--[if IE]>
<marquee behavior="scroll" direction="up" scrollamount="2" scrolldelay="1" onmouseover="this.stop()" onmouseout="this.start()" height="205" width="100%">
<p><a href="http://www.google.fr" target="blank" ><img src="img/logo_efs.jpg" width="155" height="210" border="none"></a></p>
<p><br>
<img src="img/logo_cciad.jpg" width="155" height="55" border="none"></p>
<p><br>
<img src="img/logo_dakar.jpg" width="155" height="194"><br>
</p>
</marquee>
<![endif]-->



<marquee behavior="scroll" direction="up" scrollamount="2" scrolldelay="1" onmouseover="this.stop()" onmouseout="this.start()" height="205" width="100%">
<p><br><br><br><br><br><br><br><br><br><br><br><br><br><br><a href="http://www.google.fr" target="blank" ><img src="img/logo_efs.jpg" width="155" height="210" border="none"></a></p>
<p><br>
<img src="img/logo_cciad.jpg" width="155" height="55" border="none"></p>
<p><br>
<img src="img/logo_dakar.jpg" width="155" height="194"><br>
</p><p><br><br><br><br><br><br><br><br><br><br><br><br><br><br></p>
</marquee>


</div>
Merci pour votre aide

PS : Ah oui et le truc aussi, c'est quand je passe ma souris sur firefox sur une image sa stop correctement, et sur IE les images ne s'arretent pas.. Si vous avez aussi une idée pour ce petit probleme (mais c'est pas le principal lol)