5568 sujets

Sémantique web et HTML

Bonjour.

Je travail actuellement sur un site extensible, valide w3c, et codé de manière très spécial pour qu'il soit adapté sur tout les navigateurs.

Seulement voilà, j'ai cherché une solution pour mon problème, sans résultat.

IE6, 7, ou 8, passe en quirks mode si un bout de code, ou même un caractère se trouve avant le Doctype.


<?
	session_cache_limiter('private, must-revalidate');
	
	session_start();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" />


Ma question est simple, je cherche à faire en sorte de pouvoir avoir mon code php avant le doctype sans activé le quirks mode (indispensable au bon fonctionnement du site). Ca me semble impossible. Il existe une solution aternative ?

Merci d'avance.
Modifié par Scrapy (18 May 2009 - 19:10)
Salut,

Scrapy a écrit :
Ma question est simple, je cherche à faire en sorte de pouvoir avoir mon code php avant le doctype sans activé le quirks mode
Il suffit pour cela que le code PHP ne génère aucune écriture HTML... et c'est bien le cas du tien. Il est possible par contre que tu aies d'autres caractères avant ou après tes balises PHP :
* sauts de lignes
* espaces
* caractère UTF-8 avec BOM
* autre...
Et bien... J'ai fais un copier coller exacte du code que j'ai, et rien n'y change malheureusement.

J'ai vérifié, il y a aucun caractère en trop. Par contre si je bouge après le doctype ou si je supprime mon bout de code php, ca ne bug plus.

quelques infos:
J'utilise Wampserver 2.0 avec comme version du php 5.2.9-2.

C'est p'têtre Wamp ? Je vais up ça sur un serveur pour tester.
Modifié par Scrapy (18 May 2009 - 19:37)
Scrapy a écrit :
J'ai vérifié, il y a aucun caractère en trop. Par contre si je bouge après le doctype ou si je supprime mon bout de code php, ca ne bug plus.
Si tu as enregistré cette page en UTF-8, il faut vérifier pour le BOM.

Mais avant tout il faudrait vérifier le code html généré (un warning PHP peut par exemple générer du code en plus).
Modifié par Heyoan (18 May 2009 - 19:43)
Ma page est codé en ANSI.

Mais je crois avoir trouvé le problème. Je pense que c'est WAMP. (Tout ca pour rien).

Quand je up les fichiers sur le serveur, aucun problème.

Quand je regarde avant wamp le code source de la page généré avec IE8, le php apparait. Le navigateur à donc... vu ce code avant le doctype. Maintenant, reste à savoir pourquoi IE laisse afficher le php avec wamp.

C'est bizarre... Vraiment bizarre.
Modifié par Scrapy (18 May 2009 - 19:56)
Scrapy a écrit :
Quand je regarde avant wamp le code source de la page généré avec IE8
Eh bien cela veut dire que le PHP n'est pas reconnu... et je suppose que c'est parce que tu utilises <? à la place de <?php.
Bravo ! Je vais tout de suite me laver les yeux à la javel pour éviter de refaire ce genre d'erreur.

Merci.
Modifié par Scrapy (18 May 2009 - 20:43)
Salut,

Pour info, quand tu installes WAMP, les short tags sont désactivés dans le php.ini (directive short_open_tag à off), et c'est pas un mal.

Alors qu'en général, les serveurs mutualisés sont configurés par défaut avec la directive à on.
J'ai un second soucis.

On a un petit script JS qui nous sert de portfolio dynamique. Seulement il ne marche plus sur tout les navigateur s'il se trouve après le doctype (à la base, c'était le vrai problème, mais je me suis basé sur ce code php).

Il y a un moyen de mettre "<script src="realisations.js" type="text/javascript"></script>" avant le doctype, sans pour autant qu'ie ne change de mode ?

Merci.
Modifié par Scrapy (18 May 2009 - 22:27)
Scrapy a écrit :
J'ai un second soucis.

On a un petit script JS qui nous sert de portfolio dynamique. Seulement il ne marche plus sur tout les navigateur s'il se trouve après le doctype (à la base, c'était le vrai problème, mais je me suis basé sur ce code php).

Il y a un moyen de mettre "<script src="realisations.js" type="text/javascript"></script>" avant le doctype, sans pour autant qu'ie ne change de mode ?

Merci.


Il vaudrait peut-être mieux essayer de résoudre le problème et comprendre pourquoi ce script ne fonctionne pas si on le place là où il devrait être, non ?
Oui c'est ce qui me semble le plus juste.

Seulement j'ai pas du tout de notions JS, c'est un ami qui s'en occupe, je vais faire l'intermédiaire pour expliquer le problème.

Tout d'abord,

<script src="realisations.js" type="text/javascript"></script>


si ce code se trouve avant le doctype, firefox et ie l'affiche comme il le faut (seulement IE bug a cause du quirks mode).

Par contre, si on met le script dans le head la ou il devrait être, firefox l'interprète très mal (et la sous ie, y'a pas de problème).

Voici le code de "realisations.js":


var bleueOpen = true;
var roseOpen = true;
var verteOpen = true;
var jauneOpen = true;

function down(id)
{
	setTimeout(function(){ document.getElementById(id).style.display = 'block'; }, 0);
	setTimeout(function(){ document.getElementById(id).style.height = 5; }, 0);
	setTimeout(function(){ document.getElementById(id).style.height = 10; }, 30);
	setTimeout(function(){ document.getElementById(id).style.height = 15; }, 60);
	setTimeout(function(){ document.getElementById(id).style.height = 20; }, 90);
	setTimeout(function(){ document.getElementById(id).style.height = 25; }, 120);
	setTimeout(function(){ document.getElementById(id).style.height = 30; }, 150);
	setTimeout(function(){ document.getElementById(id).style.height = 35; }, 180);
	setTimeout(function(){ document.getElementById(id).style.height = 40; }, 210);
	setTimeout(function(){ document.getElementById(id).style.height = 45; }, 240);
	setTimeout(function(){ document.getElementById(id).style.height = 50; }, 270);
	setTimeout(function(){ document.getElementById(id).style.height = 55; }, 300);
	setTimeout(function(){ document.getElementById(id).style.height = 60; }, 330);
	setTimeout(function(){ document.getElementById(id).style.height = 65; }, 360);
	setTimeout(function(){ document.getElementById(id).style.height = 70; }, 390);
	setTimeout(function(){ document.getElementById(id).style.height = 75; }, 420);
	setTimeout(function(){ document.getElementById(id).style.height = 80; }, 450);
}

function up(id)
{
	setTimeout(function(){ document.getElementById(id).style.height = 75; }, 0);
	setTimeout(function(){ document.getElementById(id).style.height = 70; }, 30);
	setTimeout(function(){ document.getElementById(id).style.height = 65; }, 60);
	setTimeout(function(){ document.getElementById(id).style.height = 60; }, 90);
	setTimeout(function(){ document.getElementById(id).style.height = 55; }, 120);
	setTimeout(function(){ document.getElementById(id).style.height = 50; }, 150);
	setTimeout(function(){ document.getElementById(id).style.height = 45; }, 180);
	setTimeout(function(){ document.getElementById(id).style.height = 40; }, 210);
	setTimeout(function(){ document.getElementById(id).style.height = 35; }, 240);
	setTimeout(function(){ document.getElementById(id).style.height = 30; }, 270);
	setTimeout(function(){ document.getElementById(id).style.height = 25; }, 300);
	setTimeout(function(){ document.getElementById(id).style.height = 20; }, 330);
	setTimeout(function(){ document.getElementById(id).style.height = 15; }, 360);
	setTimeout(function(){ document.getElementById(id).style.height = 10; }, 390);
	setTimeout(function(){ document.getElementById(id).style.height = 5; }, 420);
	setTimeout(function(){ document.getElementById(id).style.height = 0; }, 450);
	setTimeout(function(){ document.getElementById(id).style.display = 'none'; }, 450);
}

function effetload()
{
	document.getElementById(2).style.display = 'none';
	document.getElementById(3).style.display = 'none';
	document.getElementById(4).style.display = 'none';
}

function effet(id)
{
	if (id == 1 && bleueOpen)
	{
		down(1);
		bleueOpen = false;
		
		if (!roseOpen) { up(2); roseOpen = true; }
		if (!verteOpen) { up(3); verteOpen = true; }
		if (!jauneOpen) { up(4); jauneOpen = true; }
	}
	else if (id == 1)
	{
		document.getElementById(2).style.display = 'none';
		document.getElementById(3).style.display = 'none';
		document.getElementById(4).style.display = 'none';
		up(1);
		bleueOpen = true;
	}
	
	if (id == 2 && roseOpen)
	{
		down(2);
		roseOpen = false;
		
		if (!bleueOpen) { up(1); bleueOpen = true; }
		if (!verteOpen) { up(3); verteOpen = true; }
		if (!jauneOpen) { up(4); jauneOpen = true; }
	}
	else if (id == 2)
	{
		document.getElementById(1).style.display = 'none';
		document.getElementById(3).style.display = 'none';
		document.getElementById(4).style.display = 'none';
		up(2);
		roseOpen = true;
	}
	
	if (id == 3 && verteOpen)
	{
		down(3);
		verteOpen = false;
		
		if (!bleueOpen) { up(1); bleueOpen = true; }
		if (!roseOpen) { up(2); roseOpen = true; }
		if (!jauneOpen) { up(4); jauneOpen = true; }
	}
	else if (id == 3)
	{
		document.getElementById(1).style.display = 'none';
		document.getElementById(2).style.display = 'none';
		document.getElementById(4).style.display = 'none';
		up(3);
		verteOpen = true;
	}
	
	if (id == 4 && jauneOpen)
	{
		down(4);
		jauneOpen = false;
		
		if (!bleueOpen) { up(1); bleueOpen = true; }
		if (!roseOpen) { up(2); roseOpen = true; }
		if (!verteOpen) { up(3); verteOpen = true; }
	}
	else if (id == 4)
	{
		document.getElementById(1).style.display = 'none';
		document.getElementById(2).style.display = 'none';
		document.getElementById(3).style.display = 'none';
		up(4);
		jauneOpen = true;
	}
}



Ce thread devrait peut être maintenant se trouver sur JavaScript, ECMAScript, DOM.

Merci d'avance pour celui qui a une idée du pourquoi du comment. Moi et mon pote on est un peu dépassé. Smiley ohwell
Modifié par Scrapy (18 May 2009 - 23:00)
Alors déjà :

1) Il est censé faire quoi, ce script ?

2) Ca signifie quoi "Firefox l'interprète très mal" ?

3) Il est utilisé (appelé) comment ?

Eventuellement peut-on avoir le code de la page HTML, voire carrément une page en ligne ?
Je vais faire ça au plus vite.

edit:

Voici un exemple: test1 (ça marche que sur IE), ou
<script src="realisations.js" type="text/javascript"></script>
se trouve après le doctype.

Voici un autre exemple: test2 (ou ça marche avec tout les navigateurs, sauf que le quirks mode est activé), ou
<script src="realisations.js" type="text/javascript"></script>
se trouve avant le doctype.


Le script, c'est les 4 menus qui se trouve au centre du design, avec popup.

Désolé si le design est incohérent, c'est juste un exemple.


J'espère que ça sera suffisant.
Modifié par Scrapy (19 May 2009 - 01:03)
Hello,

ça fonctionnerait sûrement mieux avec un doctype valide :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
(sans balises auto-fermantes).
Salut Heyoan.

Tu as mis le doigt sur un truc.

Avec les balise auto-fermantes, Ca marche sur IE et Safari. Sur chrome et firefox, non.

Par contre sans les balise auto fermante, ça ne marche plus sur Safari, ca plante exactement comme sur chrome ou firefox.

Ca complique la tâche Smiley ravi Je vais laisser sans les "/" comme ça devrait l'être.
Modifié par Scrapy (19 May 2009 - 18:30)