Je suis bien désolé pour les utilisateurs du logiciel Microsoft Internet Explorer. Non seulement parce qu’ils ne se rendent pas compte qu’ils utilisent le pire navigateur Internet qui soit, mais aussi parce que depuis l’article précédent sur la vue panoramique du beffroi, ils n’avaient plus accès au Journal de Julien ci-présent. Je ne m’en étais pas rendu compte, évidemment: j’utilise Mozilla Firefox, navigateur capable de comprendre et d’interpréter un code source valide de site Internet.
Que s’est-il passé ?
Pour publier cette photographie panoramique, j’ai installé un nouveau plugin sur le moteur de ce blog WordPress. Le plugin s’appelle LightBox2, c’est grâce à ce morceau de programme supplémentaire que vous pouviez (non-pas avec Internet Explorer mais avec tous les autres navigateurs dignes de ce nom) ouvrir l’agrandissement de l’image en surimpression sur la page actuellement lue.
Suite aux divers appels de ma fidèle lectrice Isabelle qui se plaignait de ne plus avoir accès au Journal de Julien, j’ai tout-de-même voulu vérifier l’afficage sous IE. Et là, catastrophe! Oui, catastrophe comme toujours lorsqu’on développe un site et qu’on le contrôle sous IE. Merci Isabelle!
Le plugin LightBox2 programmé par Lokesh Dhakar empêchait carrément le site de s’ouvrir… sous IE.
Il semble qu’il y ait un problème dans la fonction PHP nommée lightbox_wp_head() mais je n’ai pas cherché à le résoudre. J’ai effacé le plugin et je l’ai remplacé par un autre.
Son successeur est basé sur la bibliothèque javascript jQuery et s’appelle FancyBox. Il s’installe en un seul clic, fonctionne à ravir sous tous les navigateurs que j’ai essayés, et rend même un affichage plus joli qu’une lightbox: l’image agrandie prend pour taille maximale la largeur de la fenêtre du navigateur client, c’est-à-dire que vous n’avez pas besoin de dérouler de gauche à droite pour faire défiler l’image si elle est trop grande, c’est elle qui s’adapte. Et puis il y a une petite animation paramétrable etc. Bravo… (je ne connais pas le nom du développeur).
Seconde horreur: la balise pre
Autre désagréable surprise sour IE: les textes cités dans les balises HTML <pre> étaient formatés n’importe comment, sortaient de la colonne principale, ce qui faisait que tout le site était dézingué (menus censés se trouver à droite descendus en bas de page etc).
Comme d’habitude, il a fallu trouver un « hack » pour faire fonctionner le formatage des balises de citation dans IE. Ce code, je vous le poste ici, dans des balises @ltpre>! :
pre {
width: 450px;
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}
Cette définition de style en langage CSS permet la césure automatique des phrases et force le retour à la ligne en fin de largeur. Ici la largeur paramétrée est 450 pixels.
Le Journal de Julien s’est refait une beauté, du moins pour les utilisateurs de IE, mais que cela ne les empêche en rien de « switcher* » ! (*changer de système)