Ca y est, jQuery continue sa progression et perce de plus en plus les différentes communautés de développement. Dernière en date la nouvelle version de WordPress qui intègre jQuery dans sa console d’administration.
Concernant WordPress, beaucoup de nouveautés que je n’ai pas encore tout � fait saisi, mais que je vais pas tarder � découvrir 
Difficile de l’identifier si on utilise la version compressée… voici comment la récupérer:
$.prototype["jquery"]
Prenons comme exemple la petite image d’Eric dans mon blog (juste ci-dessus). Cette image change toutes les 10 secondes environ avec un petit effet de transition, pas encore très sexy, mais c’est une première esquisse du code qu’idéalement je devrais améliorer par la suite.
Avant toute chose il faut charger dans la page jQuery. Ensuite, afin d’afficher rapidement les images, qui sont assez lourdes, on utilise un petit plugin qui va se charger de mettre dans le cache du navigateur toutes nos images, seulement une fois que la page sera complètement chargée.
Ensuite, nous allons mettre dans une variable le chemin vers le répertoire du template de wordpress dans lequel nous avons stocké nos images, et on commence à les mettre dans le cache du navigateur (imaginons que nous en avons 10 et que toutes ont le même prefixe et qu’elles sont du même format).
Pour finir, on ajoute le bout de code qui se charge de changer l’image de manière aléatoire toutes les dix secondes pour obtenir:
$.preloadImages = function()
{
for(var i = 0; i<arguments .length; i++)
{
img = new Image();
img.src = arguments[i];
}
}
$(document).ready(function(){
var imagePath = "<?php bloginfo('stylesheet_directory'); ?>/images/";
for (i=0; i<10; i++)
{
$.preloadImages(imagePath + "eric" + i + ".jpg");
}
var refreshImage = setInterval(function() {
randomnumber=Math.floor(Math.random()*10);
$("img[@alt=banner]").hide();
$("img[@alt=banner]").attr("src", imagePath + "eric" + randomnumber + ".jpg").fadeIn('slow');
}, 10000);
});
Notez, que vous pouvez remplacer $("img[@alt=banner]") par la classe ou par l’id assigné à l’image de votre bannière.
Le pas suivant sera d’insérer une image de transition ainsi que la vérification que la nouvelle image soit différente de celle affichée juste avant.
Comment insérer de manière très délicate une animation flash dans un site? Pfff, simple, en passant par jQuery (est-ce que je vous ai dit que la version 1.1.1 est sorie?) et un plugin spécialement conçu pour ça: jQuery Flash Plugin.
L’appel au plugin est tout aussi simple (on peut bien évidemment rajouter d’autres propriétés… se référer à la doc du plugin):
$(’#hello’).flash({
src: ‘hello.swf’,
width: 320,
height: 240
});
Un post intéressant, dans la mailing liste de Cake PHP, à parcourir si on veut convaincre quelqu’un que jQuery est bien plus efficace que Prototype.
Bonne nouvelle, la version 1.04 de la librarie vient de sortir avec un tonne de bugs corrigés et quelques nouvelles fonctionnalités. Consultez l’annonce pour plus détails directement sur le blog de jQuery.
Autre nouvelle, l’API de jQuery (1.0.3) vient d’être publiée sur http://gotapi.com/. Belle initiative.
Très intéressant outil en ligne, JMe Feed Aggregator, qui agrège des flux RSS d’Apple et de sites qui parlent de Web2.0. Le tout en utilisant massivement jQuery pour le front-end et PHP/MySQL pour le reste
Sympa, graphiquement très agréable, dommage qu’il ne soit pas encore personnalisable, notamment en ce qui concerne les flux à chercher…
Rien à dire, avec jQuery et quelques petits plugin on peut faire de vrais merveilles. Une gallerie de photos fort étonnante. Tiens, ça me donne envie de recoder un peu mon outil de photoblog développé avec Code Igniter, bien que le temps me manque en ce moment…
On connaît bien jQuery, mais tout le monde n’est pas forcément au courant de la possibilité de profiter d’une petite portion de la syntaxe de XPath afin d’exploiter encore plus la librairie JavaScript.
Concrètement XPath vous permet d’extraire efficacement des portions d’un document XML ou XHTML. Grâce à Google j’ai pu repérer la page relative à XPath pour jQuery, ce dernier utilisant n’utilisant qu’une petite partie de la syntaxe, mais qui peut tout de même s’avérer très utile dans plusieurs situations.
Si vous utilisez jQuery, je vous suggère de faire le détour
Pour en savoir plus sur XPath, je vous renvoie à WikiPedia et à W3Schools afin d’avoir des compléments d’information et voir concrètement de quoi il s’agit.