Bonjour,
alors voila mon problème j'ai un petit code en javascript qui fonctionne parfaitement lorsque je ne met pas de doctype a ma page html. Par contre lorsque je met le doctype :
<!DOCTYPE html PUBLIC "-//W3C//DTDXHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
le code ne fonctionne plus, et j'arrive pas a savoir d'où sa vien.. :( le code me permet de faire arrivé mon texte petit a petit, voila le code js :
var spd=100;
var obj;
function mov(p) {
with(obj[p].style) {
y = parseInt(top) / 1.2;
top = 10 + y;
if(y<0)window.setTimeout("mov("+p+")",16);
else top=10;
}
}
onload = function (){
// text
T = document.getElementById("hash").innerHTML.split(" ");
for(i=0;i<T.length;i++){
o=document.createElement("span");
document.body.appendChild(o);
z=T[i].indexOf("http");if(z>=0)T[i]="<a href='"+T[i].substring(z)+"'>"+T[i]+"</a>";
t=T[i].toLowerCase();z=t.indexOf("img");if(z>0)T[i]+=" "+T[i+1],T[i+1]="";
o.innerHTML=T[i]+" ";
o.style.top=-document.body.offsetHeight*10;
window.setTimeout("mov("+i+")",1000+i*spd);
}
obj=document.getElementsByTagName("span");
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>hail the old masters - Interactive DHTML art-demos</title>
<meta name="Author" content="Gerard Ferrandez at http://www.dhteumeuleu.com">
<link rel="stylesheet" href="../css/style.css" type="text/css" />
<script type="text/javascript" src="../js/texte.js"></script>
</head>
<body>
<div id=hash style="display:none">
<strong>Ovidius Ars Amatoria I</strong><br><br>
Siquis in hoc artem populo non novit amandi, <br> Hoc legat et lecto carmine doctus amet. <br>Arte citae veloque rates remoque moventur, <br> Arte leves currus: arte regendus amor. <br><br>
<strong><em>5</em></strong> Curribus Automedon lentisque erat aptus habenis, <br> Tiphys in Haemonia puppe magister erat: <br>Me Venus artificem tenero praefecit Amori; <br> Tiphys et Automedon dicar Amoris ego. <br>Ille quidem ferus est et qui mihi saepe repugnet: <br><br>
<strong><em>10</em></strong> Sed puer est, aetas mollis et apta regi. <br>Phillyrides puerum cithara perfecit Achillem, <br> Atque animos placida contudit arte feros. <br>Qui totiens socios, totiens exterruit hostes, <br> Creditur annosum pertimuisse senem. <br><br>
<strong><em>15</em></strong> Quas Hector sensurus erat, poscente magistro...
<br><br>
<img src="encrierplume.gif"> http://www.ulikoehler.de/Autoren/Ovid/ArsAmatoria01.html
<br>
</div>
</body></html>
j'espère que j'ai été assez compréhensible.. Merci pour vos futur réponse!
Tu utilises un <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict et tu ne respectes pas les régles quel intérêt ? Change par un <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional peut-être que ça passera ou alors utiliser un DOCTYPE non XHTML
C'est bon problème résolu en fait quand on est en mode strict en XHTML, ce mode vaut aussi pour la CSS. Or en CSS on doit toujours préciser les unités pour les valeurs.
Donc il faut ajouter "px" (pour pixel) à chaque fois qu'on modifies la propriété top.
Ce qui donne le js suivant :
function mov(p) {
with(obj[p].style) {
y = parseInt(top) / 1.2;
top = 10 + y +"px";
if(y<0)
window.setTimeout("mov("+p+")",16);
else
top="10px";
}
}
onload = function (){
// text
T = document.getElementById("hash").innerHTML.split(" ");
for(i=0;i<T.length;i++){
o=document.createElement("span");
document.body.appendChild(o);
z=T[i].indexOf("http");
if(z>=0)
T[i]="<a href='"+T[i].substring(z)+"'>"+T[i]+"</a>";
t=T[i].toLowerCase();
z=t.indexOf("img");
if(z>0)
T[i]+=" "+T[i+1],T[i+1]="";
o.innerHTML=T[i]+" ";
o.style.top=-document.body.offsetHeight*10+"px";
window.setTimeout("mov("+i+")",1000+i*spd);
}
obj=document.getElementsByTagName("span");
}
