Mootools Forge — La bibliothèque Javascript Mootools manquait d’un espace de partage et vient tout juste d’ouvrir sa forge pour centraliser les plugins développés par les utilisateurs. C’est une bonne idée car une des raisons du succès rencontré par jQuery vient probablement de la multitude des plugins disponibles au téléchargement. Via Kromack.
Menu déroulant Suckerfish — réécriture du très populaire Suckerfish Dropdown pour implémenter des menus déroulants sur plusieurs niveaux. Ce script de 12 lignes crée une classe sfHover sur un élément li pour émuler la pseudo-classe :hover pour Internet Explorer qui ne l’applique que sur les ancres a, notamment. Ce script est léger, accessible, basé sur les feuilles de styles et non-intrusif (à part dans la feuille de style puisqu’il faut doubler le sélecteur li:hover avec la classeli.sfHover). →
Smart Columns with CSS & jQuery est un tutoriel qui explique comment créer des colonnes dont le nombre s’ajuste à de la taille de la fenêtre disponible sans laisser de blancs disgracieux quand la largeur disponible n’est pas un multiple de la largeur d’une colonne. Hum, le mieux c’est encore de voir l’exemple et de s’amuser à changer les dimensions du viewport. Etonnant, non ?
Get viewport size (width and height) with javascript — Parce qu’il est parfois utile de connaitre la largeur et la hauteur disponible dans la fenêtre du navigateur.
Ceebox est un plugin jQuery totalement réécrit il y a peu pour afficher n’importe quel contenu dans une fenêtre modale ou non de type lightbox. Ceebox donne toute sa mesure lors de l’insertion de vidéos hébergées sur Google Video, Dailymotion ou Youtube.
Il est possible d’afficher une galerie mélangeant différents types de contenus, y compris via Ajax. Le plugin nécessite SWFObject jQuery Plugin pour l’affichage des vidéos et s’active de différentes manières. Pour finir, les nombreux paramètres par défaut sont modifiables pour s’adapter à toutes les situations.
Text Resizing width jQuery — Même s’il vaut mieux laisser les visiteurs se débrouiller avec les fonctionnalités intégrées à leur navigateur préféré, voici un script de plus pour modifier la taille du texte sur votre site web. Petit bonus avec le retour à la taille par défaut.
Juste un petit mot pour vous signaler l’ouverture de Planet jQuery sur lequel j’ai inscris les flux RSS relatifs aux tags jquery qui apparaissent sur js 4 design et css 4 design.
Vous le savez sans doute, mais si le DOM propose une fonction pour sélectionner un élément par son id ou son nom, ce n’est pas (encore) le cas pour sélectionner les éléments qui partagent une ou plusieurs classes. C’est là qu’intervient The Ultimate GetElementsByClassName déjà évoqué dans Utillisez le DOM et Javascript comme un chef pour redéfinir le comportement des balises HTML. →
Image jQuery — Cet effet réalisé avec quelques lignes de jQuery (et un soupçon de CSS) applique un léger effet de zoom sur une image tout en affichant sa description au survol de la souris sur le conteneur. Voir la démonstration.
maxWidthFixForIE6.js — Les expressions Javascript de Microsoft sont énormément utilisée pour pallier l’absence de support de telle ou telle fonctionnalité par pour IE6 en particulier ou Internet Explorer en général alors que leur utilisation grève les performances déjà inquiètantes du dernier de la classe. Il vaut mieux faire appel à du bon vieux Javascript !
window.onload = checkAvailableWidth;
window.onresize = checkAvailableWidth;
function checkAvailableWidth(){
var container = document.getElementById("container");
container.style.width = (document.body.clientWidth > 1100)? "1100px" : "auto";
}