Débugger de la promenade de pingouins

[Ludwig von 97]

Salut !

J'ai un très très vieux script que j'avais récupéré à l'époque je sais pas où et que j'avais modifié, il y a une dizaine d'années.

Aujourd'hui il fonctionne toujours.
Démo: http://lv97.net/promenade-de-pingouins/original/

Le problème c'est que dés que je mets un doctype à mon document, alors il ne fonctionne plus.

Pourriez vous m'aider à le débugger s'il vous plaît ? Je fais du .NET et du Java mais en javascript je suis un peu perdu par les outils.

J'ai juste remarqué avec Firebug qu'avec un doctype le script fonctionne car la position des pingouins change, mais ils se déplace à une hauteur négative.

Vous pouvez télécharger le package de fichiers ici:
http://lv97.net/promenade-de-pingoui...-pingouins.zip


Aussi, je me demande si la variable startloc et ses références ne devraient pas disparaître parce que je me demande si elle sert à quoi que ce soit.


Merci de votre aide,

LV97

PS : Si possible j'aimerais bien que ce script soit HTML5 ready ;-)

[Ludwig von 97]

Désolé, je viens de me rendre compte que j'avais laissé en démo un fichier .htm avec un DOCTYPE qui ne pouvait donc pas fonctionné. La démo fonctionne à nouveau.

Mais le problème "Faire fonctionne ce script avec un doctype" n'est toujours pas résolu.

[NoSmoking]

Bonsoir,
essaies de mettre dans la feuille de style

Code css :

1
2
3
4
html, body{
  height:100%;
  width:100%;
}

[Ludwig von 97]

Merci. En fait je n'ai pas eu l'occasion de tester ta solution mais j'ai trouvé un moyen de corriger l'erreur en remplaçant:

Code :

1
2
3
var height, width;
height = document.body.clientHeight + document.body.scrollTop;
width = document.body.clientWidth + document.body.scrollLeft;

par le code suivant:

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
		var width,height;
		if(typeof window.innerWidth!='undefined'){//the most standard compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
			width=window.innerWidth
			height=window.innerHeight
		}
		//IE6 in standards compliant mode(i.e. with a valid doctype as the first line in the document)
		else if(typeof document.documentElement!='undefined' && typeof document.documentElement.clientWidth!='undefined' && document.documentElement.clientWidth!=0){
			width=document.documentElement.clientWidth
			height=document.documentElement.clientHeight
		}else{//older versions of IE
			width=document.getElementsByTagName('body')[0].clientWidth
			height=document.getElementsByTagName('body')[0].clientHeight
		}

Trouvé sur : http://andylangton.co.uk/articles/ja...ze-javascript/

[Ludwig von 97]

Correction, il faut que je reprenne le scroll en compte. Mais je verrai si ça marche demain.