Du libre et du sport - Tag - jQuery

Mettre en avant certains commentaires avec jQuery

Osku — Thu, 27 Dec 2007 14:58:00 +0100

Avec jQuery il est possible de mettre en avant certains de vos commentateurs.
Pour les commentaires filtrés sur l'adresse web utilisée. On ajoute une classe aux éléments dt qui contient les infos du commentateur et au contenu du commentaire dd

$("div#comments dt a[@href*='dotclear']") .parents("dt") .next("dd") .addClass("dotclearComment");
$("div#comments dt a[@href*='dotclear']") .parents("dt") .addClass("dotclearComment");

Pour cet exemple, j'imagine qu'on utilise un thème avec la structure <dl>, <dt>, <dd>, <dt>, <dd> ...
Ensuite, il suffit d'ajouter une règle dans la feuille style :

dt.dotclearComment,dd.dotclearComment{color:green;background-color:black}

Il est certainement possible de plouguéniser la chose sans utiliser le framework jQuery ;-)

Thème DC2 : Wjsdark Simple

Osku — Fri, 14 Dec 2007 16:45:00 +0100

Voici le thème Wjsdark Simple, un thème pour DotClear 2 avec tout plein de jQuery dedans.

Mini screenshot :

Installation :

Rien de nouveau de ce coté là, ça se passe comme d'habitude. Puis choisissez la décoration via Paramètres des Thèmes dans la partie administration de vote DC2.

Configuration :

Comme le thème Wsuper, vous pouvez peaufiner la feuille de style et les différents effets jQuery (je reviendrais en détails plus tard sur le sujet), tout n'est pas encore nickel de ce coté là - ça viendra.

Quelques fonctionnalités :

Si vous choisissez d'afficher le bloc 'recherche' parmi vos widgets, une loupe apparait en haut à droite de votre navigateur, il suffit de cliquer dessus pour laisser apparaitre le formulaire de recherche. Des effets d'accordéon sont définis sur toute la #sidebar, comme l'affichage des billets (seul le premier billet est déroulé). Dans le contexte du billet seul, il est possible de

masquer/afficher le corps du billet en cliquant sur le titre du billet
masquer/afficher l'ensemble des commentaires en cliquant sur le titre 'Commentaires'

Vilains bugs

IE n'affiche pas la loupe de recherche. La transparence du peu des images utilisées est mal gérée par IE

Licence :

GPL car c'est la plus courte à utiliser ;-)
Les pièces jointes sont lourdes du fait des différents éléments jQuery fourni. Je m'excuse auprès des heureux propriétaires de connexions bas-débit.

jQuery : plugin color

Osku — Tue, 13 Nov 2007 15:07:00 +0100

Bon, on continue dans la série des billets sur jQuery :-).
L'effet .animate permet de faire des trucs déjà sympas sauf de jouer sur les couleurs...
Je cherche et je découvre un plugin jQuery.color.js qui permet de jouer sur les couleurs des éléments css :

la couleur du text via 'color'
la couleur du fond via 'backgroundColor'
ou encore les différentes bordures via 'borderBottomColor', 'borderLeftColor', 'borderRightColor' et 'borderTopColor'

Le plugin semble uniquement compatible avec jQuery version 1.2 ou supérieure.

Exemple

$(document).ready(function(){
     $("#go").click(function(){
     $(".block").animate( { backgroundColor:'#008CFF', color:'#EFF8FF', borderLeftColor:'#000'}, 2000)
                       .animate( { backgroundColor:'#fff', color:'#444', borderLeftColor:'yellow'}, 2000);
     });
});

Ceci est un gros bloc qui change de couleurs si vous cliquez sur le bouton

Epatant, non ?