Rechercher : dans
Par :

Problème doctype et dhtml !! urgent svp !!

Dernière réponse le 29 oct 2009 à 09:32:02 walid01300, le 28 oct 2009 à 18:05:36 
 Signaler ce message aux modérateurs

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//DTD XHTML 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");
}



css :


*
{
	padding : 0;
	margin : 0;
}

body {text-align:right; padding:0; margin:0; position:absolute; overflow:hidden; background:#FFF; left:0; top:0; width:100%; height:100%;}
	span {
		POSITION: relative;
		font-family: arial;
		font-weight:normal;
		color: #000000;
		font-size: 14px;
		z-index:1;
		left:-10%;
	}



et html :

<!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!
Configuration: Windows 7
Firefox 3.5.3

Meilleures réponses pour « problème doctype et dhtml !! urgent svp !! » dans :
Introduction au Dynamic HTML (DHTML) Voir Présentation du DHTML Le DHTML (Dynamic HyperText Markup Language) n'est pas à proprement parler un langage de balises pour Internet, il n'existe d'ailleurs aucune norme DHTML à part entière. En réalité, le DHTML est un ensemble de...
Les balises dans la partie 'head' VoirAvant tout : rappel sur le doctype La partie head Balises meta Mots clés Description Déclaration de la langue du site Catégorie Auteur Restrictions pour les moteurs de recherche Adresse de la page Logiciels utilisés pour la...
DHTML - La notion de couche VoirQu'est-ce qu'une couche? Le DHTML est basé sur une fonctionnalité provenant de la norme 4.0 du HTML: les feuilles de style en cascade de positionnement, aussi appelée CSS-P (Cascading Style Sheets Positionning). Celles-ci permettent de définir des...
Positionner des éléments grâce aux CSS VoirIl est possible grâce aux feuilles de style de positionner au pixel près du texte ou des images grâce aux balises et . Cela est possible avec les versions 4 de Netscape et d'Internet Explorer, cependant cette technique reste hasardeuse...
Structure d'un document HTML VoirNotion de document HTML Une page HTML est un simple fichier contenant du texte formatté avec des balises HTML. Par convention l'extension donnée au fichier est .htm ou .html, mais une page web peut potentiellement porter n'importe quelle...

1

boulepate62, le 29 oct 2009 à 01:37:17

Bonjour

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 en forgeant que l'on devient forgeron !

Répondre à boulepate62

3

 walid01300, le 29 oct 2009 à 09:32:02

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


Voila !

Répondre à walid01300
Collection CommentÇaMarche.net