Discussion :

[Danwan]

Bonjour à tous.

J'ai trouvé sur ce site un script fort utile, mais génère un bug dans mon cas : https://codepen.io/rbobrowski/pen/likvA

Dans le tout dernier bloc de texte avec balise <p>, le javascript indique d'y appliquer un border-radius.

Malheureusement si j'y ajoute, dans ce paragraphe, un lien, c'est dans la balise <a> qu'il ajoute le style et non dans le <p>.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<a href="#" style="border-radius: 0px 0px 10px 10px;">Contact</a>

Si dans le javascript j'adapte un peu, je vais appliquer le border-radius sur l'ensemble des paragraphes. En bref, je ne trouve pas...

Auriez vous une idée ?

Merci à tous pour votre aide

[SpaceFrog]

Je ne comprends pas la problématique ...
sur le codepen il y a bien un border radius ...
le style s'applique à l'élément porteur de l'attribut style (ou mieux de la classe)
Je ne comprend pas ton étonnement à ce que le style s'applique sur la balise a si tu mets le style dans la balise a ...

[Danwan]

Tout à fait. Ca marche bien si je tape du texte "simple" dans la dernière balise Paragraphe.

Cependant si j'y mets un lien, par exemple, dans ce paragraphe, le script s'occupe d'appliquer le style à la toute dernière balise. Et donc pas la bonne.

Merci :-)

En image :

[SpaceFrog]

si tu relis bien ma réponse précédente ...

le style s'applique à l'élément porteur de l'attribut style

le p n'est pas porteur du style ...

[Danwan]

Et justement, comment l'obliger ?

Car ma balise <a> est neutre. C'est le script qui, de force l'intègre.

Seulement si dans le script je modifie ici, par : p:visible:last.
C'est à tous les paragraphes que j'applique la fonction, donc ca ne va pas

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
subItem.slideToggle("fast",function() {
        $(".accordion p:visible:last").css("border-radius","0 0 10px 10px");
    });

[Loralina]

Bonjour,
Je ne fais pas de jQuery, mais après quelques recherches dans la documentation, j'ai tenté ceci qui semble aller :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$(".accordion").find("p,"+headers.join(",")).filter(":visible:last").css("border-radius","0 0 10px 10px");

[Danwan]

En plein dans le mille... mes connaissances en javascript étant de zéro, je n'arrivais pas à adapter ce modèle trouvé.

Merci infiniment @Loralina

Et merci aussi @SpaceFrog pour ton analyse. Toujours important d'avoir des interactions sur un forum.

Merciiiiiiiiiiiiiiiii

[SpaceFrog]

il suffisait de mettre directement

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

style="border-radius: 0px 0px 10px 10px;"

dans la balise p ...

[Loralina]

Bonjour,
Oui, c'est vrai SpaceFrog.
Dans le cas présent, les balises <p> ne devraient jamais avoir d'arrondi, à l'exception de la dernière qui, elle, peut tout le temps en avoir un.
Ainsi, on pouvait faire un cas particulier dans le html sans modifier le js initial.
Il resterait que ce code ajouterait toujours automatiquement l'arrondi à la balise <a>, ce qui n'est pas idéal, sans être gênant non plus.