Comment utiliser Less, Sass et Stylus sur un serveur distant.
Voici une méthode simple et efficace et qui peut permettre l'utilisation de frameworks.
(...) Voir l'article complet"Pop-up bar" en CSS3 et HTML5 classList API
"Pop-up bar" le plus simple possible. Il est animé en CSS3 en utilisant la propriété transition. Pour que ces transitions s'effectuent, j'ai mis du Vanilla Javascript (ce qui permet de l'utiliser partout sans entrer en conflit avec une librairie Javascript) pour ajouter et enlever une classe sur l'élément "popup".
(...) Voir l'article completPetit Slideshow Mootools
Un petit slideshow très simple en Mootools.
(...) Voir l'article completAjouter des zéros (ou autre caractère) en préfixes.
Fonction PHP et JavaScript pour ajouter un caractère en préfixe.
(...) Voir l'article completMenu avec vidéo sous les boutons en HTML5
Menu avec images survolées qui laisse apparaître un vidéo en HTML5.
Sous-menu animé avec Mootools
Ce sous-menu s'ouvre lorsque l'utilisateur se rend sur le menu. Lorsqu'il se déplace sur chacun des éléments du menu, une animation va déplacer les sous-éléments verticalement.
Passer des arguments à une fonction anonyme
Comment passer des arguments à une fonction d'une librairie que l'on ne contrôle pas.
(...) Voir l'article completEffet de loupe sur image avec Mootools et CSS3
Tutoriel pour créer un effet de loupe sur image avec Mootools et CSS3
(...) Voir l'article completImbriquage de tweets et intégration avec Masonry
Javascript et css pour pouvoir se faire un "wall" de tweets imbriqués avec intégration de Masonry.
(...) Voir l'article completComment créer un lecteur audio HTML5
Ce tutoriel va démontrer comment s'interfacer avec un lecteur audio HTML5. On connait tous le lecteur mais je veux aller complètement ailleurs ici. Évidemment, tous les fureteurs ne rendent pas le même résultat visuellement et vous ne voulez pas briser votre design.
(...) Voir l'article completTest de navigateur, PHP, JS et Flash
Il arrive souvent que l'on développe un site web et que chez un client il n'obtient plus le résultat escompté. C'est alors quelques fois très ardu de savoir ce qui peut causer ce problème. Voici un petit outil pour vous aider à déterminer la cause.
(...) Voir l'article completTransition d'images pour galerie en Mootools
Pour le travail, j'ai travaillé sur des animations de transition d'images pour une galerie. Voici le code mootools, html et css pour ces animations.
(...) Voir l'article completDébuter les transitions seulement quand la page est téléchargée
Voici une traduction d'un article très intéressant et pratique.
Transitions Only After Page Load de Cris Coyier
(...) Voir l'article completAccordéon avec Mootools et CSS3
Code pour un menu accordéon en CSS3 et Mootools. Facilement configurable.
(...) Voir l'article completParallax simple en Mootools
Parallax en Mootools. HTML, CSS et Javascript très simple et épuré pour faciliter son utilisation.
(...) Voir l'article completLes bookmarklets, ou se créer des raccourcis
Les bookmarlets sont des petites fonctions Javascript entreposées en tant qu'un URL d'un favoris que l'on peut placer dans notre barre de favoris et sont utilisées et gérées comme un favori. Ellers sont donc des outils agissant en un seul clic afin d'éviter de répéter des tâches ou encore de modifier une page courante en temps réel.
(...) Voir l'article completDéplacer des "object"
Je travaillais sur un projet où je devais déplacer un objet dans le DOM. En fait, je bougeais un lecteur vidéo dans sa page.
(...) Voir l'article complet6 meilleurs Frameworks HTML5/CSS3 pour des présentations Slideshow
Dans cette liste nous allons couvrir quelques-uns des meilleurs "framework" qui permettent de créer des présentations rapidement et simplement.
(...) Voir l'article completPortfolio/Galerie avec Navigation en Mootools et CSS3
Encore une fois, j'ai travaillé sur la confection d'un portfolio. Cette fois-ci, un portfolio/galerie plein écran avec navigation en Mootools et CSS3 fonctionnel sur tous les navigateurs. (IE ne peut cependant afficher les petites subtilités CSS3.)
La délégation d’événements
Un des fonctionnalités des libraires JavaScript que j’adore et utilise souvent est la délégation d’événements.
(...) Voir l'article completMootools tubular permet d'avoir une vidéo Youtube de votre choix en arrière-plan de votre site.
Mootools tubular permet d'avoir une vidéo Youtube de votre choix en arrière-plan de votre site.
Classification par animation "Fx slide" de Mootools
Pour mon portfolio j'ai construit un outil de classification avec animation "slide" de Mootools, voici comment le faire.
Menu avec animation d'images en Mootools (version 1.1)
Après quelques petits ajouts, voici la version 1.1 de mon menu avec animation d'images en Mootools.
25 secrets des outils de développement de navigateur
25 secrets des outils de développement de navigateur
Solution de compatibilité en Mootools pour Placeholder
Il existe beaucoup de façons pour utiliser dès maintenant l'attribut PLACEHOLDER. En voici une, toute simple, en Mootools.
Album photos empilés en CSS3 et mootools
Voici un petit effet/animation en CSS3 et Mootools d'un album de photos empilés.
3 façons de cibler les appareils mobiles
Cet article va discuter de comment cibler les appareils mobiles et d'afficher un contenu différent, différentes feuilles de styles et même rediriger à un URL mobile.
Portfolio galerie en Mootools (version 1.2)
Galerie pour portfolio en mootools que vous pouvez télécharger. Simple d'utilisation et très esthétique.
Système d'évaluation en Mootools et CSS3 (rating system)
J'ai vu un beau "rating system" en Jquery, ne travaillant qu'avec Mootools, j'ai décidé de le réécrire et de l'améliorer. J'en ai fait une classe réutilisable partout et pouvant gérer plusieurs "rating system" sur la même page. De plus, il est prêt à être utilisé conjointement à un fichier PHP pour gérer l'évaluation d'un article avec une base de données.
Simple menu avec accordéon en Mootools
Petit menu tout simple mais fort sympathique et utile.(...)
Voir l'article completPlugin Mootools pour redimensionner la police d'écriture
Je suis tombé sur un plugin fort intéressant en Jquery de Dave Rupert. Je l'ai donc transposé en Mootools pour pouvoir moi-même l'utiliser. FixText rend la grosseur de la police d'écriture flexible aux browsers. Il est avantageux d'utiliser ce plugin avec un "fluid Layout" pour que son texte se redimensionne selon la largeur de son parent.
(...) Voir l'article completCarrousel pour galerie en Mootools
J'ai beaucoup fouillé sur internet pour un carrousel en Mootools, sans grand succès. Sois ces carrousels ne fonctionnaient pas comme je voulais, sois ils ne fonctionnaient pas tout court. J'ai donc décidé d'en faire un comme je le voulais. Comme j'ai chercher pour celui et que je n'ai rien trouvé, j'ai décidé de vous le partager.
(...) Voir l'article completHTML5 Boilerplate, un template puissant et complet
HTML5 Boilerplate est un template (HTML+CSS+JS+...) lancé par Paul Irish (Modernizr) et Divya Manian. Il contient toutes les bonnes pratiques du moment en terme de performances, de compatibilité inter-navigateurs, de JavaScript, avec un soupçon d'accessibilité (si utilisé à bon escient), voire de Flash.
(...) Voir l'article complet