Comment ça marche?
Utiliser l'initiative d'information IE sur votre site est aussi simple que d'inclure
le code suivant dans le corps de vos pages HTML:
<!--[if lte IE 7]>
<script src="http://ieai.pieroxy.net/ieai.js"></script>
<![endif]-->
Ce code doit être placé entre la balise <body>
et la balise </body>, de préférence vers la fin de la page.
Pas mal de choses sont configurables:
Quelle version d'IE?
Par défaut, le script sera affiché à tous les utilisateurs d'IE6 et IE7. Pour
changer ce comportement, il cous suffit d'ajouter le bout de code suivant
avant d'inclure le fichier javascript:
<!--[if lte IE 6]>
<script language="javascript">
var ieai_alertfor=6;
</script>
<script src="http://ieai.pieroxy.net/ieai.js"></script>
<![endif]-->
Dans l'exemple ci-dessus, le message sera affiché à tous les utilisateurs d'IE6
et en dessous. Notez qu'il faut définir la version d'IE à deux endroits: Dans
le commentaire conditionnel et dans la variable ieai_alertfor.
Pour afficher le message à tous les utilisateurs d'Internet
Explorer, placez la variable à 8. Vous pouvez bien sûr définir une version qui
est au dessus de la version actuelle d'IE, comme 9 ou 10. Vu que IE9 n'est pas
encore sorti, on ne sais pas comment s'il exhibera les problèmes que nous essayons
de combattre. Restons raisonnables et n'affichons un message qu'aux nacigateurs
dont nous savons qu'ils le méritent.
Pourquoi ne pas proposer IE8?
C'est vrai, pourquoi pas? IE8 est plutôt pas mal. Même s'il n'est pas très
compétitif dans le marché actuel, il est très loin du mal
que nous fait IE6.
Vous pouvez proposer à vos internautes d'installer IE8 en même temps que les
autres alternatives en ajoutant le code suivant:
<!--[if lte IE 7]>
<script language="javascript">
var ieai_showie8=true;
</script>
<script src="http://ieai.pieroxy.net/ieai.js"></script>
<![endif]-->
Quelle langue est-ce que ça parle?
Le code supporte plusieurs langues. Si votre langue n'est pas supportée, vous
pouvez personnaliser les messages (voir le point suivant) ou vous pouvez
nous donner la traduction des 5 messages
de la popup. De cette façon, tout le monde bénéficiera de votre travail.
La langue est déduite du navigateur de l'internaute. Pour résumer, si tout va bien
ils verront le message dans leur langue ou bien en Anglais si leur langue n'est pas
supportée ou n'a pas pu être déterminée.
Cette détection marche bien dans la majorité des cas. Si vous voulez toutefois
forcer la langue du message, vous pouvez le faire comme décrit ci-dessous:
<!--[if lte IE 7]>
<script language="javascript">
var ieai_lang='en';
</script>
<script src="http://ieai.pieroxy.net/ieai.js"></script>
<![endif]-->
Au jour d'aujourd'hui, seules les valeurs
'fr',
'nl' et
'en' marchent.
De toutes façon, le message ne me va pas
Vous pouvez personnaliser le message affiché dans la popup. Il vous suffit de le
faire comme suit:
<!--[if lte IE 7]>
<script language="javascript">
var ieai_textClose="Fermer la fenêtre";
var ieai_textLink="En savoir plus";
var ieai_textTitle="Vous utilisez IE"; // Le script rajoute la version d'IE
var ieai_textMain="Beuuuurk";
var ieai_textRecommend="Allez, faites vous plaisir avec les navigateurs ci-dessous";
</script>
<script src="http://ieai.pieroxy.net/ieai.js"></script>
<![endif]-->
Bug? Bug!
|
La popup est un simple DIV html qui a une position absolue. Sur IE6, si vous
avez une liste déroulante (<select>)
derrière le DIV, elle se verra à travers la popup. Jetez un oeil à la copie d'écran ci-contre
pour voir ce que ça donne.
Ce problème est l'un des problèmes pour lesquels cette initiative existe.
Malheureusement, il n'y a pas de solution élégante, comme bien souvent lorsqu'on
à affaire à IE6.
Le code ieai.js cherche une méthode ieai_show()
avant d'afficher le message, et une autre méthode ieai_hide()
avant d'effacer le message. Il vous faudra définir ces deux méthodes et cacher
/ afficher la ilste déroulante pour éviter le problème. Bien évidemment, si votre
site n'exhibe pas ce symptôme, vous n'avez besoin de rien.
Ce problème se manifeste sur tous les sites web avec des listes déroulantes
des applets flash ou java applets et avec tous les contrôles "lourds" pour IE6.
Ci-dessous, un exemple de code qui fait ça.
|
Ci-dessous, une copie d'écran du bug sous IE6.
|
<!--[if lte IE 6]>
<SCRIPT>
function ieai_show() {
document.getElementById('MySelect').style.visibility='hidden';
}
function ieai_hide() {
document.getElementById('MySelect').style.visibility='';
}
var ieai_alertfor=6; // C'informe que IE6
</SCRIPT>
<SCRIPT src="http://ieai.pieroxy.net/ieai.js"></SCRIPT>
<![endif]-->
C'est tout?
Ben ouais, c'est tout. Ceci dit, si vous voulez une version personnalisée du code,
prenez-le et faites-en ce que vous voulez. Le code est copyrighté à moi et je le
distribut sous la
license libre WTFPL,
sans restrictions. Le but est de faire passer le message.
Si vous avez une meilleure idée, venez la partager
dans le forum, on est intéressés. Ou alors faites-le
vous-même! Chacun est libre de faire ce qu'il veut ;-)
