Dans un ancien article, je parlais de l'utilisation des sprites en CSS pour afficher des onglets. Il est vrai que l'exemple choisi était assez médiocre, très loin d'illustrer l'étendue des possibilités offertes par cette technique, qui rappelons le, trouve son origine dans le monde des jeux vidéos. A titre d'exemple plus explicite, j'ai ici créé une petite ébauche d'application graphique inspirée du célèbre jeu "Grand Theft Auto", dans laquelle les véhicules et différents états du personnage sont issus de sprites. Cet exemple est écrit très rapidement grâce à la librairie jQuery, le plus fastidieux étant de composer les sprites dans Photoshop ;)

Réagir à cet article | Lire la suite >>>

Dans la continuité du précedent billet, voici un clône du mythique "Pong" adapté en Javascript avec jQuery.

Réagir à cet article | Lire la suite >>>

Pour me familiariser avec la librairie jQuery et découvrir ses possibilités d'animation, je me suis amusé avec beaucoup de nostalgie à réaliser une grossière adaptation du célèbre jeu vidéo "Duck Hunt". L'application obtenue en quelques rapides lignes de code est accessible via le lien ci-dessous.

Réagir à cet article | Lire la suite >>>

MooTools 1.1 permettait de soumettre très simplement nos formulaires de manière asynchrone. La méthode send() de l'objet Form se chargeait de tout : Détection des attributs method et action du formulaire, envoi de toutes les données du formulaire via AJAX, réception de la réponse du serveur et même la possibilité de mettre à jour la page HTML avec le contenu ainsi reçu. On ne pouvait rêver plus simple, les fainéants comme moi s'en trouvaient ravis.

$('myForm').addEvent('submit', function(e) {
    new Event(e).stop();
    this.send({
        update: $('ajax_response')
    });
});

Depuis MooTools 1.2, à moins que je n'ai loupé une étape, il est nécessaire de passer par un objet Request qu'il faut initialiser soi-même pour reproduire le même comportement.

$('myForm').addEvent('submit', function(e) {
    new Event(e).stop();
    new Request({
        method: this.method,
        url: this.action,
        onSuccess: function(responseText, responseXML) {
            $('ajax_response').setHTML(responseText);
        }
    }).send(this.toQueryString());
});

Réagir à cet article | Lire la suite >>>