boite defilante en javascript = bug sur design css

**le Lun Mar 22, 2004 19:31**

Voici un js que j'utilise sur drimmo et qui fonctionne a merveille. Quand je veux l'utiliser sur le design css que je prepare, ca defile, MAIS: en position depart, tous les textes sont superposés, et le texte qui monte au dessus de la case passe dessus et reste donc visible. malheureusement j connais rien en js...et vous?

Code: Tout sélectionner: <script language="JavaScript1.2"> ejs_scroll_largeur = 110; ejs_scroll_hauteur = 130; ejs_scroll_bgcolor = '#FFFDF0'; /* Mettre ici le chemin de l'image de fond */ ejs_scroll_background = ""; /* Mettre ici le temps en secondes */ ejs_scroll_pause_seconde = 5; ejs_scroll_message = new Array; ejs_scroll_message[0]='<a href="#"><strong><u><font size=2>menu infos</font></u></strong><br><br>Nouveau menu avec des informations sur l\'assurance, les credits ou prets, ainsi qu\'une rubrique juridique</a>'; ejs_scroll_message[1]='<a href="#"><strong><u><font size=2>FeedBack</font></u></strong><br><br>N\'hésitez pas à nous donner votre avis sur Drimmo, afin de nous permettre d\améliorer notre service</a>'; ejs_scroll_message[2]='<a href="#"><strong><u><font size=2>Ajoutez une annonce à vos favoris</font></u></strong><br><br>L\'équipe de drimmo vous souhaite une heureuse année 2004!!!</a>'; ejs_scroll_message[3]='<a href="clubannonces.php"><strong><u><font size=2>Nouvelle offre ClubAnnonces</font></u></strong><br><br>ClubAnnonces vous propose désormais une offre Internet + presse papier en publiant vos annonces sur France-soir</a>'; function d(texte) { document.write(texte); } d('<DIV ID=ejs_scroll_relativ STYLE="position:relative;width:'+ejs_scroll_largeur+';height:'+ejs_scroll_hauteur+';background-color:'+ejs_scroll_bgcolor+';background-image:url('+ejs_scroll_background+')">'); d('<DIV ID=ejs_scroll_cadre STYLE="position:absolute;width:'+(ejs_scroll_largeur-8)+';height:'+(ejs_scroll_hauteur-8)+';top:4;left:4;clip:rect(0 '+(ejs_scroll_largeur-8)+' '+(ejs_scroll_hauteur-8)+' 0)">'); d('<div id=ejs_scroller_1 style="position:absolute;width:'+(ejs_scroll_largeur-8)+';left:0;top:0;" class=txtpetit>'+ejs_scroll_message[0]+'</DIV>'); d('<div id=ejs_scroller_2 style="position:absolute;width:'+(ejs_scroll_largeur-8)+';left:0;top:'+ejs_scroll_hauteur+';" class=txtpetit>'+ejs_scroll_message[1]+'</DIV>'); d('</DIV></DIV>'); ejs_scroll_mode =1; ejs_scroll_actuel = 0; function ejs_scroll_start() { if(ejs_scroll_mode == 1) { ejs_scroller_haut = "ejs_scroller_1"; ejs_scroller_bas = "ejs_scroller_2"; ejs_scroll_mode = 0; } else { ejs_scroller_bas = "ejs_scroller_1"; ejs_scroller_haut = "ejs_scroller_2"; ejs_scroll_mode = 1; } ejs_scroll_nb_message = ejs_scroll_message.length-1; if(ejs_scroll_actuel == ejs_scroll_nb_message) ejs_scroll_suivant = 0; else ejs_scroll_suivant = ejs_scroll_actuel+1; if(document.getElementById) document.getElementById(ejs_scroller_bas).innerHTML = ejs_scroll_message[ejs_scroll_suivant]; ejs_scroll_top = 0; if(document.getElementById) setTimeout("ejs_scroll_action()",ejs_scroll_pause_seconde*1000) } function ejs_scroll_action() { ejs_scroll_top -= 1; document.getElementById(ejs_scroller_haut).style.top = ejs_scroll_top; document.getElementById(ejs_scroller_bas).style.top = ejs_scroll_top+ejs_scroll_hauteur; if((ejs_scroll_top+ejs_scroll_hauteur) > 0) setTimeout("ejs_scroll_action()",40) else ejs_scroll_stop() } function ejs_scroll_stop() { ejs_scroll_actuel = ejs_scroll_suivant; ejs_scroll_start() } window.onload = ejs_scroll_start; </script>

**le Lun Mar 22, 2004 19:59**

Je viens de trouver d'ou venait le probleme, et c'est assez surprenant:

LE DOCTYPE !!!!!!!!!!!!!!!!!!!!!!!

j'utilisais ca:

Code: Tout sélectionner: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

si je mets rien, ca fonctionne...

c'est vraiment utile le doctype?
A+++

**le Lun Mar 22, 2004 20:11**

yannouk a écrit:c'est vraiment utile le doctype?

Bien sûr que c'est utile, c'est même très important. C'est ce qui permet à ton navigateur de choisir quel mode de rendu utiliser pour le document. Sans doctype, point de validation.

Un petit tour sur http://openweb.eu.org s'impose

**le Lun Mar 22, 2004 21:13**

je connais openweb...mais je veux dire:

si je respecte les standards, c'est pas pour afficher leur logo en gros et me gargariser...non, c'est juste pour les nombreux avantages que ca offre. Donc la validation w3c, je m'en contrefous.
est-ce que le doctype change reellement la facon dont la page est interprétée par les navigateurs? (mis a part le coup du calcul des largeurs, differents etre le w3c et le modele microsoft)

**le Lun Mar 22, 2004 21:34**

yannouk a écrit:est-ce que le doctype change reellement la facon dont la page est interprétée par les navigateurs?

Oui ça change. Comment la navigateur va-t-il savoir s'il faut qu'il interprète la page en HTML 2.1 ou en XHTML 1.0 si rien ne lui dit ? En l'absence de doctype il lit le document en mode natif, soit à l'ancienne (c'est à dire non conforme).

**le Lun Mar 22, 2004 22:26**

et ce mode natif, ca empeche la page d'etre lue dans les navigateurs non graphiques, dans les navigateurs recents, dans les navigateurs anciens.....? ou pas?
pkoi avec moz, opera et ie6, rien n'a changé

**le Lun Mar 22, 2004 22:41**

Si, l'affichage de ton js

C'est bien la preuve qu'avec ou sans doctype, ce n'est plus du tout la même chose.

**le Lun Mar 22, 2004 22:49**

Bonjour yannouk,

Je ne m'y connais pas assez en JavaScript pour l'affirmer, mais il est fort possible que ce soit ton script qui ne soit pas valide http://openweb.eu.org/articles/html_au_xhtml/

Autres liens :
- http://selfhtml.selfhtml.com.fr/html/xhtml/differences.htm#script_style
- http://mozilla.tlk.fr/doc03.php
- http://www.mozilla.tlk.fr/doc05.php

As-tu essayé en plaçant ton script en fichier externe ?

Amicalement,
Monique

**le Mar Mar 23, 2004 10:19**

oui, j'ai essayé ca ne change rien. Je me suis resolu a placer le script dans une iframe, mais j'aurais aimé eviter

boite defilante en javascript = bug sur design css

boite defilante en javascript = bug sur design css

Formation recommandée sur ce thème :

Lectures recommandées sur ce thème :

Qui est en ligne