Archive for March, 2007

IE browser sniffing

Thursday, March 29th, 2007

Comment détecter qu’un utilisateur utilise Internet Explorer ?

Dean Edwards nous propose la méthode la plus courte (en terme de code ;-) ) que j’ai eu l’occasion de voir.

var isMSIE = /*@cc_on!@*/false;

Bon, si on veut, on peut même faire plus court …

var isMSIE = /*@cc_on!@*/0;

Tester

Equivalent CSS de cellpadding et cellspacing

Wednesday, March 21st, 2007

Tout d’abord, ce qu’il faut noter, c’est que les attributs cellpadding et cellspacing ne sont pas dépréciés en HTML 4, et même pas en XHTML 1.1.
Cela vient sans doute du fait qu’il n’y avait pas encore d’équivalent à ces propriétés en CSS1 lorsque le HTML 4 a été rédigé.

Depuis le CSS2, vous pouvez vous passer de ces propriétés, et faire votre mise en forme uniquement en CSS :-D

Pour le cellpadding, c’est assez simple, il faut attribuer la propriété padding à toutes les cellules du tableau.

One Two Three
Four Five Six
table#monTableau td
{
	padding:0px;
}

Pour cellspacing, en revanche, c’est un (tout) petit peu plus complexe.

Si vous voulez supprimer le cellspacing, il faut utiliser border-collapse. Cela fonctionne avec tous les navigateurs.

One Two Three
Four Five Six
table#monTableau
{
	border-collapse:collapse;
}

Enfin, si vous voulez mettre un espace défini entre chaque cellule, il faut utiliser border-spacing. En revanche, cela ne marchera pas avec Internet Explorer.

One Two Three
Four Five Six
table#monTableau
{
	border-spacing: 10px;
}

Et voilà, c’est tout pour aujourd’hui ;-)

Smoothbox, Thickbox pour Mootools

Saturday, March 17th, 2007

Voici, en avant première mondiale lol, Smoothbox, la conversion pour Mootools du script Thickbox de Cody Lindley, codée par moi-même.

Pour mémoire, Thickbox est un script fonctionnant sous jQuery, et qui permet d’afficher, tout comme Lightbox ou Slimbox, une fenêtre en superposition de la page, tout en faisant apparaître un overlay.

A ce jour, Thickbox est le seul script permettant simultanément d’afficher, de manière unobtrusive :

  • Une image seule
  • Un groupement de plusieurs images
  • Du contenu inline
  • Du contenu via Iframe
  • Du contenu AJAX

J’ai allégé le code, corrigé quelques bugs, et rajouté un effet de fondu à l’ouverture.

Le script fonctionne avec tous les browsers modernes, à l’exception de Konqueror. Cela dit, aucun script de ce type utilisant un effet de fondu ne fonctionne actuellement sous Konqueror, que cela soit Lightbox v2, Slimbox, Moodalbox, etc …

Le script est unobtrusif dans le sens où si vous désactivez le javascript, tout continue à fonctionner correctement !! ;-)

Tester Smoothbox

Mootools v1.1 en cours de développement

Thursday, March 15th, 2007

Valerio nous fait part via le forum de mootools du changelog de la version 1.1 qui est à venir.

Quelques rajouts, des corrections de bugs, et un fonctionnement plus rapide :-)

———————————————————————————————————–
#Additions
———————————————————————————————————–
– CUSTOM EVENTS!
– $each also iterates objects
– added Element::getStyles
– added Element::hasChild
– added Array::include
– added Array::merge
– added $merge, to merge objects
– Dom.js uses XPATH in supporting browsers
– the use of +'px' in setStyle is not required anymore.
– added XHR::cancel
———————————————————————————————————–
#Changes
———————————————————————————————————–
– Object.extend is now $extend, still compatible
– Object.native is now $native, still compatible
– Element has been splitted in Element.Events, Element.Form, Element.Dimensions
———————————————————————————————————–
#Elements Creation
———————————————————————————————————–
– elements creation is easier: new Element accepts second param
– elements creation for elements with name/type is easier, just use second argument.
– setProperty for name/type are is supported anymore.
———————————————————————————————————–
#Notable Fixes
———————————————————————————————————–
– dom logic is highly optimized and its blazing fast
– better sortables, no more flickering, removed Drag dependency
– Fx.Slide now accepts borders and margins. Positioning is now possible.
– Element::toQueryString in ajax now works as intended with all Form elements, including multiple selects.
– Element::setStyle supports float
– Element::setProperty and Element::getProperty now supports "for"
———————————————————————————————————–
#Obvious Things
———————————————————————————————————–
– code cleanup and optimization
– bugs and incompatbilities fixed
– mootools is faster, FASTER, FAAASTEEERRR
———————————————————————————————————–
#TODO
———————————————————————————————————–
– some bugs left
– testing
– css3 selectors (?)
– ???

Perso, la correction de toQueryString me fait bien plaisir. Plus besoin de se prendre la tête pour serializer les selects multiples (ce qui m’est arrivé lors de mon dernier projet).

Mootools, le framework javascript qui monte ;-)

JSJuicer version 1.1

Tuesday, March 13th, 2007

Adrian m’a annoncé aujourd’hui la disponibilité de la version 1.1 de JSJuicer.

Au programme, la prise en charge des commentaires conditionnels spécifiques à Internet Explorer.

J’ai fait la mise à jour sur mon édition web, vous pouvez donc tester la 1.1 sans avoir besoin de télécharger et de compiler le soft.

Tester JSJuicer Web Edition version 1.1

JSJuicer, yet another JS packer

Friday, March 9th, 2007

Adrian Johnston viens de nous concocter JSJuicer, un nouveau packer javascript à l’image du (presque) célèbre Jsmin de Douglas Crockford. C’est un soft permettant de réduire significativement la taille de vos fichiers javascript, donc de gagner en temps de chargement et en bande passante. Le procédé permet en outre de rendre le code relativement illisible, et donc de se protéger contre un plagiat éventuel. Ce soft est codé en C++, et est à utiliser en ligne de commande.

Les fonctionnalités de ce packer sont les suivantes :

  • Suppression des commentaires
  • Suppression des lignes de debug commençant par ;;;
  • Suppression des espaces et des retours chariot
  • Obfuscation du code

Malheureusement, après quelques tests, on s’aperçoit que l’obfuscation rend le JS inutilisable. On devra donc se contenter des autres options.
Après avoir “essoré” un de mes scripts perso, on passe d’une taille de 11K à une taille de 7.1K, soit un gain de 26%.
Autre essai avec un fichier plus gros, mootools v1, avec tous les plugins : on passe de 140K à 60K, soit un gain appréciable de 57%.
Dans les deux cas, si on active pas l’obfuscation, les scripts restent totalement fonctionnels, aucun bug de créé.

Si vous en voulez plus, vous pouvez ajouter une petite compression gzip.

Pour ceux que cela intéresse j’ai réalisé une édition web de JSJuicer ;-)
Elle est dispo dans la section Labs de mon site.
Cela permet d’utiliser le script sans rien avoir à downloader ou à compiler.

Tester JSJuicer Web Edition