Le TwiBlog

The one with Twidi

Aller au contenu | Aller au menu | Aller à la recherche

lundi 26 septembre 2005

Developer Toolbar pour IE sous Wine

Vous connaissez tous l'extension "Web Developer" de firefox, indispensable pour tout développeur web...

Et bien Microsoft a sorti la sienne pour IE et je vous propose de l'installer pour votre IE sous Wine

Pour l'installer, c'est simple.

Vous téléchargez le .msi sur la page pré-citée (je n'ai pas réussi avec ie sous wine, j'ai donc utilisé fx)

Vous installez, si ce n'est déjà fait MS Installer :

"msi" = "native, builtin"
"msiexec.exe" = "native, builtin"

Une fois MS Installer installé, utilisez la ligne de commande suivante pour installer votre barre d'outil au format .msi :

wine msiexec /i msifile.msi

vendredi 23 septembre 2005

Javascript : getElementsBy.... CSS selector !

Les connaisseurs sauront combien peuvent être utiles les deux fonctions que sont

  • getElementById : récupérer un élément du DOM par son ID
  • get ElementsByTagName : récupérer un tableau d'éléments définis par un tag

Et bien voici quelques chose de très utile : récupérer un tableau d'éléments par un sélecteur CSS !

Deux scripts pour ça :

Je n'évoquerai pas les nombreuses possibilités offertes par ces scripts, mais néanmoins sachez que des outils tel que "csshover.htc" sont développés dans le même esprit (csshover.htc possède d'ailleurs une fonction GetElementsBySelect)

Il devient facile avec ce genre d'outil de développer ses propres htc ou équivalent, qui répondront à un besoin précis, plutôt que charger à chaque fois les htc qui peuvent ralentir le chargement de la page en l'analysant au démarrage.

mercredi 21 septembre 2005

Utiliser les sélecteurs CSS pour ajouter des évènements javascript

Même si mon titre n'est pas forcément très clair, c'est un outil fabuleux que je viens de découvrir : Behaviour : Using CSS selectors to apply Javascript behaviours

Cet outil permet, en utilisant des sélecteurs css comme descripteur, d'ajouter des évènements javascript à tout objet contenu dans une page, sans avoir à modifier le code xhtml de la page.

Le plus simple est de voir l'exemple exposé sur le site de l'auteur : http://bennolan.com/behaviour/

vendredi 16 septembre 2005

PNG alpha dans internet explorer

En complément de l'article précédent, voici un autre behavior pour qu'internet explorer gère correctement les canneaux alph des images png.

http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html

Pour l'utilisation, même principe, rajouter le sélecteur

img { behavior: url("pngbehavior.htc"); }

Par contre ne pas oublier de télécharger également l'image blank.gif. Plus d'explications sur le site de l'auteur.

Survol d'éléments css avec internet explorer

Dans le design web, quelque chose qui manque vraiment à internet explorer, c'est la gestion des "hover" sur autre chose que des liens.

"hover", c'est une pseudo-class qui s'utilise de la façon suivante :

#mon_element:hover { monc_code_css }

Le css indiqué sera alors appliqué à l'élément au survol de ce dernier.

L'absence de cette fonctionnalité dans internet explorer frustre notre créativité.

Or il existe une solution. Un fichier "htc", qui modifie le comportement d'internet explorer. On connaissait déjà le magnifique mais lourd "ie7" (qui n'a rien a voir avec internet explorer 7, mais l'auteur a du utiliser ce nom dans l'idée de proposer tout ce qu'il aimerait voir dans internet explorer 7) que l'on trouvera ici : http://dean.edwards.name/IE7/.

Mais là point besoin de charger tout ça, nous utiliseront le "csshover.htc" que nous propose le cite http://www.xs4all.nl/~peterned/csshover.html

Comment l'utiliser ? Très simplement... Il suffit de rajouter dans sa css

body { behavior: url(csshover.htc); }

(en n'oubliant pas de placer le htc dans le même répertoire que le css ;)

Seul défaut de ce procédé, la feuille de style ne validera plus, il peut être alors pertinent de placer cette déclaration dans un css à part, importé grace à @import.