Looking for…

La nouvelle viens de tomber, mon CDD de webmaster ne donnera pas de suite.

Je suis donc à nouveau sur le marché, et suis à la recherche d’un nouveau poste de « webmaster++ ».

Par « webmaster++ » j’entend que je sais un peu plus que simplement mettre à jour du contenu via un CMS:

  • au vu du contenu de ce blog, on peut constater que je possède de bonnes bases de jQuery (et non JavaScript pur)
  • je possède également de bonnes bases en PHP procédural
  • lors de cette première expérience j’ai utilisé le CMF MODX, et ai été amené à créer des « snippets », petits bouts de code PHP pour ajouter des fonctionnalités

[JavaScript/HTML5] Et maintenant ajoutons quelques couleurs

Dans mon précédent article Amusons-nous avec les canvas, nous étions arrivés au résultat ci-dessous:

Nous avons donc ici un effet que l’on aurait pu obtenir en CSS. Mais grâce aux <canvas> nous pouvons à présent remplir notre texte avec autre chose qu’une unique couleur ; avec les <canvas> on peut utiliser des dégradés, ainsi que des images.

Lire la suite

[JavaScript/HTML5] Amusons-nous avec les canvas

Aujourd’hui nous allons voir comment ajouter du texte aux nouveaux éléments <canvas> du HTML5.

Comme les plus attentifs d’entre-vous l’auront déjà remarqué, le titre de l’article révèle déjà une partie du contenu de l’article ; effectivement, pour utiliser les canvas, il faut obligatoirement passer par JavaScript.

Lire la suite

[jQuery] Une fenêtre modale

Bonjour à tous, aujourd’hui nous allons voir comment réaliser une fenêtre modale en jQuery.

Qu’est-ce que c’est ?

Wikipédia donne la définition suivante:

Une fenêtre modale est, dans une interface graphique, une fenêtre qui prend le contrôle total du clavier et de l’écran. Elle est en général associée à une question à laquelle il est impératif que l’utilisateur réponde avant de poursuivre, ou de modifier quoi que ce soit.

Comme une démonstration vaut mieux qu’un long discours, j’ai mis en place une page de test.

Principe

Le principe utilisé ici est très simple:

  1. on place une div au-dessus de la page, grace à un z-index élevé. Cette div permet de masquer et de bloquer toute interaction avec le reste du document.
  2. on rajoute au-dessus de cette div une autre div faisant office de «fenêtre»

Lire la suite

[jQuery] Une horloge sous forme de diagramme

Avant de m’essayer à l’horloge présentée dans l’article précédent, je m’était posé la question de trouver une forme plus originale d’afficher l’heure. Après quelques recherches et essai, je suis arrivé à ce résultat.

Lire la suite

[Illustrator/jQuery] Comment réaliser une carte interactive (2/2)

À la fin de la première partie de ce tutoriel (voir ici) nous avions:

  • un dossier images contenant la carte
  • un fichier HTML comprenant notre map HTML
  • notre fichier Illustrator

Partie 2: Rendre la carte interactive à l’aide de jQuery

Les zones de maps n’étant pas stylisables via CSS, nous sommes obligés de passer par jQuery (ou tout autre framework JavaScript).

Principe utilisé: la carte de France est l’image de fond d’une division, la map HTML est appliquée sur une image transparente, qui au survol d’une zone surligne la région correspondante.

Lire la suite

[Illustrator/jQuery] Comment réaliser une carte interactive (1/2)

Dans ce tutoriel, nous allons voir comment réaliser une carte interactive comme celle-ci. Ce tutoriel sera divisé en deux parties:

  1. Création de la carte et du mappage HTML
  2. Rendre la carte interactive avec jQuery

Lire la suite

OpenSearch plugin

Aujourd’hui, nous allons voir comment créer un plugin OpenSearch.

Today, we will see how to create a simple OpenSearch plugin.

OpenSearch plugin ?

Un plugin OpenSearch est ce qui est utilisé par votre navigateur pour effectuer une recherche, sans a avoir à se rendre sur la page du site sur lequel on veut effectuer la recherche. Cela consiste en un simple fichier XML

An OpenSearch plugin is what your browser uses to search something on a site without having to open it. It consists on a simple XML file.

OpenSearch on Firefox


Lire la suite