Microjs.com présente près de 200 frameworks Javascript petits mais costauds. De combien de lignes de code avez-vous besoin pour votre projet de site web : 50K, 100K, 150K ? Ok, nous aimons tous nos bons vieux gros frameworks comme jQuery ou Mootools et nous en tirons souvent le meilleur. Mais combien de fois les avons-nous utilisés à mauvais escient ? Combien de fois avons-nous tenté d’écraser une mouche avec un tank, alors que des solutions bien plus adaptées étaient à notre portée ? →
Archives des tags : Canvas
100+ Polyfills et Fallbacks pour HTML5
Un Polyfill est un script qui permet d’émuler les fonctionnalités qui manquent à un navigateur. Par exemple, HTML5 est constitué de nombreuses API dont certaines ne sont pas prises en charge par tous les navigateurs, y compris les plus récents. Les Polyfills permettent d’utiliser ces API d’une manière standard sans être obligé d’utiliser des contournements qui seront obsolètes à terme. Pour nous aider dans cette tâche, voici une collection de bibliothèques Javascript pour implémenter les fonctionnalités HTML5 dans les navigateurs qui ne les proposent pas nativement. Modernizr est un bon point de départ pour détecter ces fonctionnalités. →
CSS Warp — Aligner du texte le long d’un tracé irrégulier avec CSS3
CSS WARP est un générateur CSS3 conçu par Eleqtriq dont les expérimentations font reculer d’un cran les limites du monde réel. En effet, CSSWARP permet d’afficher du texte le long d’une forme vectorielle irrégulière (courbe de bézier, cercle) avec la possibilité d’ajouter des points d’ancrage pour modifier le tracé, à la manière d’Illustrator. →
Burst Engine — Un peu de Flash et d’After Effects dans Canvas
Burst Engine est un moteur Javascript pour réaliser des animations vectorielles pour l’élément HTML5 Canvas. Il fournit des fonctionnalités similaires à Flash et permet de créer des animations à la manière d’After Effects. Burst est Open Source et léger, ce qui ne gâte rien.
Modernizr — Détection des fonctionnalités CSS3 et HTML5
Modernizr est une petite bibliothèque Javascript qui détecte la prise en charge (ou non) des fonctionnalités CSS3 et HTML5 comme @font-face
, canvas
, video
, rgba()
, border-radius
, les fonds multiples, CSS Columns, etc. Modernizr teste plus de 20 fonctionnalités en quelques millisecondes pour ajouter des classes spécifiques dans la balise html
indiquant indiquer la prise en charge (ou non) des propriétés testés par le navigateur. →
jQSlickWrap habille les images de formes irrégulières avec du texte
jQSlickWrap est un plugin jQuery qui permet d’habiller une image de forme irrégulière avec le texte autour. Ce script fonctionne sur les navigateurs compatibles avec la balise canvas
prévue par HTML5. Pour résumer, le script crée une balise canvas
, la remplie avec l’arrière-plan de l’image en fonction des informations de la couleur du pixel du coin supérieur gauche et redessine l’image pixel par pixel. Mais jugez plutôt !
Cette technique est une adaptation de la solution CSS et PHP proposée par Rob Swan sur A List Apart en 2006.