In this article, we will focus on the power of CSS as a descriptive language, current template system approach and their problems with modularity and extensibility, and try to mix both features from the concept to a concrete implementation.
Demo
Flexible Nav is a small jQuery library which add a smart navigation bar on the right of the page. It improves a web page navigation and helps to visualize different sections of a document, an article,.. any web page.
Nav links are distributed proportionally to the page sections. See how your scrollbar “weds” these links
Flexible Nav is both a library and a bookmarklet which can be used easily in any website.
The bookmarklet demonstrate the hackability of the web by using the semantic of web headings (h1, h2, h3, ..).
Links
- Documentation and Demos
- fork me on Github
- FlexibleNav bookmarklet (drag me in your bookmarks bar)
Mar 122011
Cette vidéo de 20 minutes présente les possibilités du Canvas à travers quelques démos et l’implémentation pas à pas d’un exemple basique.
Elle est destinée à des développeurs débutant dans l’utilisation de Canvas.
Dans la suite de l’article : les liens et codes de la vidéo …
Voici mon second podcast vidéo sur zengularity.com, reprenant la démo d’un précédent article.
Les transitions CSS3 permettent d’éviter l’utilisation du Flash ou de librairies d’animations Javascript. C’est une alternative performante car elle utilise le moteur de rendu natif du navigateur. De plus, cette solution simple et standard offre une dégradation intéressante sur les navigateurs plus anciens.
Mon premier podcast vidéo sur Zengularity.com :
Web Workers est une technologie du HTML5 qui permet d’exécuter des scripts en arrière-plan en préservant la stabilité du navigateur. Un exemple sur la recherche des nombres premiers parmi une liste de nombres illustre l’intérêt des Web Workers pour le multi-tâche.
Enjoy !
Feb 202010
I make a simple canvas game in HTML5 Canvas.
Canvas is a really great API which allows to do awesome things combined with javascript language. It’s a standard alternative to Flash and for that kind of usage, I think it can fairly compete Flash.
You can test the game in a recent browser (canvas-compatible like firefox, chrome, …) following this link.
If you want to hack the code, see the javascript here.
Pré-requis conseillé: Voir la vidéo : HTML Canvas pour les néophytes
Le HTML 5 intègre de nouvelles technologies comme le canvas, une véritable API graphique destinée à remplacer le flash dans les années à venir.
Ce tutoriel vise à présenter canvas comme une librairie très simple d’utilisation et haut niveau grâce au langage javascript.
Il vous apprendra à réaliser une animation similaire à la bannière actuelle de mon blog en quelques lignes de code.
Oct 242009
Le JavaScript est un langage très souple mais qui manque parfois de fonctionnalités si l’on en reste à ses bases.
Heureusement, de nombreuses bibliothèques sont là pour nous sauver la mise.
C’est en tout cas le cas pour le concept de l’héritage qui est rendu possible grâce à la bibliothèque base2.
Au lieu de réinventer la roue, nous pouvons utiliser cette bibliothèque et ainsi pouvoir mieux nous concentrer sur les véritables problèmes d’implémentation d’un projet.
Reactions