2009-09-17 6 views
0

Je dois afficher un code HTML différent si le navigateur est IE6/IE7. Je sais que les commentaires conditionnels fonctionnent bien si nous ne parlons que d'informations de style, mais dans ce cas particulier, c'est le balisage réel. Je vais avoir une liste non-ordonnée d'images qui sera png-24. Ils auront des coins arrondis (d'où la nécessité de la transparence fournie par png-24) et auront un style de bordure arrondi dans le CSS (3). Avec IE6 ne reconnaissant pas png-24 je veux avoir une liste alternative d'images qui sont jpg qui ont déjà les frontières incluses dans l'image. Cela gardera IE6/IE7 heureux tandis que les navigateurs conformes aux normes auront la bonne version.Alimenter HTML en IE6 uniquement

(Je le fais de cette façon parce que le site va potentiellement croître à beaucoup d'images et il doit être facile à thème.Si je produis les frontières dans le code un simple changement de couleur de bordure et il change de site. Rendez-vous IE devra toujours être manuel mais je peux créer une charge distincte pour cela s'ils le veulent vraiment pris en charge par IE6.)

Donc, ma question est quelle est la meilleure façon de le faire en utilisant PHP et y at-il des inconvénients ?

+0

« Je sais que des commentaires conditionnels fonctionnent très bien si nous ne parlons que les informations de style, mais dans ce cas particulier, il est le balisage réel. " Les commentaires conditionnels fonctionnent bien pour tout, pas seulement pour lier des feuilles de style. – TRiG

Répondre

1

Vous pouvez obtenir le navigateur UA en regardant $_SERVER['HTTP_USER_AGENT']

Here est une liste de chaînes UA pour IE.

5

Vous pouvez détecter en PHP et d'envoyer différents HTML:

$using_ie6 = ((strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE 6.') !== FALSE) || (strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE 6,0') !== FALSE)); 
if ($using_ie6) { 
    ... 
} 
else { 
    ... 
} 

Les inconvénients de cette méthode sont qu'apparemment Opera envoie parfois MSIE 6 dans son en-têtes de l'agent utilisateur, et cela peut également correspondre à IE mobile.

Envoyer du contenu différent à différents navigateurs est généralement quelque chose qu'il est bon d'éviter, autant que possible - vous vous retrouvez avec beaucoup de code en double, avec tous les maux inhérents qui en découlent.

+0

Je voudrais supprimer le '.' après le 6 comme la première version est IE6 utilisé un ',' – beggs

+1

J'ai édité dans un chèque particulier pour '6,0' - peut-être que je suis obsessionnel, mais bon, un jour, il pourrait y avoir IE 60 ...; -) –

2
$is_ie6 = (isset($_SERVER['HTTP_USER_AGENT']) && (strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE 6') !== false)); 
0

Vous pouvez le faire côté client si vous voulez, comme ceci: Faire deux divs, l'une pour IE et l'autre pour le reste du navigateur. Le DIV pour IE aura display = none; Ensuite, vous ajouterez un CSS conditionnel, uniquement pour IE, et vous cacherez la div pour les autres navigateurs et définir l'affichage IE = bloc

0

Juste une suggestion différente, ce qui devrait être possible aussi en PHP. Dans ASP.NET, vous pouvez écrire des gestionnaires spéciaux qui pourraient renvoyer toutes sortes de données binaires au client. Au lieu de réécrire vos pages, vous pouvez lier les balises d'image à un gestionnaire d'image spécial. Ce gestionnaire recevrait la requête, vérifierait la chaîne de l'agent utilisateur du client pour détecter la version du navigateur et dans le cas de IE6, il convertirait le fichier PNG en fichier JPG et le streamerait en retour. Dans d'autres cas, il retournera simplement le fichier PNG.

Votre URL serait alors regarder un peu comme http://example.org/yourpage.php?yourimage

Fondamentalement, vous seriez régler le problème beaucoup plus proche de la source du problème. Et la détection de IE6 a déjà été expliqué.

4

Utiliser des commentaires conditionnels - ils fonctionnent parfaitement bien avec le balisage, non seulement des informations de style:

<!--[if lte IE 6]> 
<p>Old school</p> 
<![endif]--> 

Voir MSDN: About Conditional Comments

+0

+1. C'est la meilleure façon de diffuser du contenu personnalisé sur IE 6 (à moins que vous ne souhaitiez absolument que le contenu spécifique à IE6 soit visible par les utilisateurs d'autres navigateurs pour une raison quelconque). En reniflant les agents utilisateurs sur le serveur, vous allez envoyer le contenu spécifique à IE6 aux bots et aux robots d'exploration qui prétendent être IE 6 et, plus important encore, n'envoie * pas * le contenu spécifique IE6 aux utilisateurs qui ont changé d'agent utilisateur ou l'a complètement bloqué (ce que font certaines entreprises et logiciels de sécurité). –

1

sont là des inconvénients?

Oh oui, beaucoup. Vous devez sortir un en-tête 'Vary' pour indiquer aux proxies/caches que la page sera différente pour chaque chaîne UA, ce qui tue l'efficacité de la mise en cache. (Si ce n'est pas le cas, les navigateurs verront les pages avec le mauvais balisage.) Et bien sûr, de nombreux navigateurs mentent sur ce qu'ils sont. J'éviterais de renifler l'UA autant que possible - et c'est presque toujours possible.

Les commentaires conditionnels sont beaucoup mieux dans le cas spécifique de présenter IE avec un balisage plus simple. Vous pouvez les utiliser n'importe où en HTML, mais notez que la syntaxe proposée par MS pour le balisage descendant n'est pas valide. Pour cibler quelque chose à IE6 seulement, au lieu essayer:

<!--[if lt IE 7]> 
    (markup for IE6) 
<![endif]--> 

<!--[if gte IE 7]><!--> 
    (markup for everyone else) 
<!--<![endif]--> 

Avec IE6 ne reconnaissant pas pour .png-24 Je veux avoir une autre liste d'images qui sont jpg qui ont déjà les frontières incluses dans l'image.

Avez-vous essayé l'un des nombreux PNG fixes pour que la transparence fonctionne dans IE6? Cela serait beaucoup plus facile (et semble mieux) que d'avoir des images séparées et un balisage.

0

Je sais que ce n'est pas ce que vous avez demandé, mais je vais le frapper quand même. Utilisez des images PNG 8 bits pour IE 6. Les images PNG ne seront pas identiques à celles de 24 bits, mais cela vous évitera de créer un balisage supplémentaire, juste une feuille de style supplémentaire avec une ligne remplaçant l'arrière-plan. image. Vous gagnez un peu de temps en ne créant pas de balisage personnalisé pour un navigateur défectueux, et le résultat final est assez proche de ce que vous voulez - en particulier si vous pouvez utiliser des JPEG opaques en PNG transparent actuellement.

On ne devrait vraiment pas être trop gentil avec IE6, bien que je sache (malheureusement) qu'il n'est pas toujours possible de faire votre propre choix à ce sujet.

0

Est-il possible d'utiliser quelque chose comme javascript, une bibliothèque, pour effectuer ce qui suit:

<!--[if ie]> 
// remove the #for_non_id_browsers and replace, using an ajax call or whatever, with an IE-suitable version 
<![endif]--> 

<div id="for_non_ie_browsers"> 
Page content 
</div>