Bonjour,
Le suis un fainéant et j'évite d'embellir les pages que je génère à l'aide d'un CMS (joomla) en mettant des balises span. Je préfère que celles ci soient modifiées automatiquement par le PC du visiteur à l'aide d'un plugin jquery.
A ce titre, j'ajoute une lettrine en tête de chaque paragraphe, si le paragraphe en question ne comporte aucune balise, de type : span, a, li,...
Dans le plugin, j'aimerais mettre en paramètre : l'identifiant de la Div concernée et la couleur de la lettrine, mais je ne sais pas faire.
Voici le fichier lettrineRouge.js :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
$(function () {
    var str = $("div.centre p");
    $.each(str, function (index, value) {
        var HauteurTexte = $("p").css('font-size');
        HauteurTexte = parseFloat(HauteurTexte) * 2.3;
        var HauteurLigneTexte = $("p").css('line-height');
        HauteurLigneTexte = parseFloat(HauteurLigneTexte) * 2 - 2;
        var CouleurLettrine = "red";
        var str = $(this).html();
        str = str.replace(/[\s]+/g, ' ');
        var regexp = /[A-Z]/gi;
        var lettres = str.split('');
        var LettreUne = lettres[0];
        if (LettreUne.match(regexp)) {
            lettres[0] = '<span style= "line-height: ' + HauteurLigneTexte + 'px; font-weight: bold; text-align: center; float:left; font-size: ' + HauteurTexte + 'px; margin-right:5px; width: ' + HauteurLigneTexte + 'px; color: ' + CouleurLettrine + '; background-color: #CCCCCC; border: solid 1px ' + CouleurLettrine + ';">' + lettres[0] + '</span>';
            str = lettres.join('');
            $(this).html(str);
        }
    });
})(jQuery);
Pour faire la même chose sur div.gauche et en mettant la lettrine en bleu, je suis obligé de générer un nouveau fichier js en modifiant le nom de la div et la ligne CouleurLettrine.
Un champion de jquery peut-il me donner le solution, par avance merci.