Le métro de NY en HTML5 !

En HTML5 (et surtout javascript, comme à chaque fois que l’on parle HTML5…), et en son & lumière avec Firefox ou Chrome  http://www.mta.me/ pour les autres… :

Conductor: www.mta.me from Alexander Chen on Vimeo.

JavaScript plus rapide pour firefox 3.1

Le nouveau moteur JavaScript de Firefox, TraceMonkey, sera intégré à la prochaine version de firefox prévue en fin d’année.

Mozilla reprend ainsi la technique trace trees déjà utilisée par l’interpréteur ActionScript d’Adobe et autorisant une compilation JavaScript Just In Time. Concrètement on optimise la puissance (méthodes et rapidité d’exécution) du JavaScript : la preuve en image.

La cible privilégiée est notamment le monde des mobiles avec une libération de la mémoire et des performances accrues. A noter que l’iPhone n’en profitera pas puisque Apple n’autorise pas l’installation d’un tel interpréteur…

TraceMonkey est surtout une excellente nouvelle pour le GeoWeb, puisqu’il augmente les capacités du JavaScript. Il augmente les possibilités d’analyse et de traitement des données vectorielles au sein du client. Là où le Flash était nécessaire, le JavaScript pourra le remplacer. Il sera aussi possible d’accéder à de vrai application de Web-Mapping à partir d’un mobile. Source.

[+] – Annonce du lancement et graphes comparatifs

Comparatif Librairies JavaScript

J’ai retrouvé ça dans les cartons… mais je ne sais plus d’où ça vient, ça ne doit plus trop être à jour d’ailleurs et il faudrait ajouter les autres… enfin voilà.

Lire la suite

AJAX et les fenêtres modales.

Avec l’apparition des anti-popups dans nos navigateurs, les vrais-faux popups ou fenêtres modales connaissent un très grand succès.
Scriptaculous a connu son essor grâce à cette technique, puis Lightbox (quasi en même temps que la thickbox, greybox et autre modalbox) a su alléger la sauce avec jQuery en ne gardant que le framework Prototype. Videobox est son équivalent pour les vidéos via les Mootools et le SwfObject. Et c’est là que iBox reprend le système en autorisant divers media et n’oublie pas de proposer une astuce pour les navigateurs sans javascript – accessibilité donc…

Il existe aujourd’hui une foule de scripts souvent basés sur Prototype.js. D’expérience, il faut toujours un peu trituré le CSS ou le javascript pour être sûr d’être crossbrowser et d’obtenir le résultat voulu (positionnement, animation…) surtout quand il s’agit d’y ajouter du Flash ou de faire dialoguer la modale avec son parent… bref pour les plus techniques d’entre nous allez donc jetez un œil sur ce comparatif très exhaustif :

Au passage notons deux excellents plugins wordpress qui utilisent le système lightbox : la version WordPress de iBox et le gestionnaire de formulaires des plus poussés j’ai nommé cForms II.

Enfin, le framework ASP.NET AJAX a encore … à faire à ce sujet.

Bravo si vous avez cliqué et lu tous les liens de cet article…

Face.book.ous

Je remarque en ce moment tout plein de petits scripts prenant exemple sur les patterns ergonomiques de Facebook… Après la pagination voici l’auto complétion (celui-ci en moo tools). Techniquement c’est sympathique toujours…

Yahoo – Ajax – Dojo – Prototype… : Webjax

Wejabx regroupe la description et l’utilisation de composants Yahoo YUI, d’effets Scriptaculous ou encore de widgets Dojo.

L’ergonomie du weblog n’est pas tip top (un comble

pour un site Ajax…) mais le contenu est bien là.

Fluide… mais utile ?

Autrefois officionados des effets Ajax/scriptacoulous, j’ai bien changé ma vision au profit de Flash…

Voici une illustration DHTML/javascript qui confirme la règle, bien que très fluide et pour une fois sans -presque- scintillement, l’ergonomie n’est pas vraiment appropriée – essayez d’attrapez une illustration du bas… Mais la performance technique est là.

Lignes alternatives : l’opérateur modulo

Voici une technique simple qui va permettre, par exemple, de colorer une ligne sur deux.

for($i=0;$i<10;$i++) {
if($i % 2) {
//macouleur=blanc
}else{
//macouleur=gris
}

Des effets CSS

» Opacity et transparence.

» Apparition de l’image en fade.

» Un faux loader… par exemple pour le chargement d’une image.

» Rendre les liens ‘visited’ plus sexy.

» Des info-bulles

» Effet sur un logo.

» De l’ombrage, aussi chez sixApart

» un rollover sur une partie d’une image.

» Généré des dégradés php et css.

» Un rating… très en vogue.

Scroll JS

» Personnaliser son scroll