Discussion :

[youtch]

Le script "Roundies" est efficace pour créer de jolis bords de calques, il permet d'avoir des bords de calques div ou span tout à fait arrondis quel que soit le navigateur. Je voudrais créer des onglets à cliquer pour afficher tel ou tel panneau, mais apparemment la compatibilité n'est pas bonne avec le code JQuery, qui marche bien tout seul par ailleurs.
Mon HTML :

Code :

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

1
2
3
4
5
6
 
	<ul id="onglets-rech">
		<li><a id="a-rech1" href="#"><span class="roundies1  ongl-actif">Onglet 1</span></a></li>
		<li><a id="a-rech2" href="#"><span class="roundies1  ongl-normal">Onglet 2</span></a></li>
		<li><a id="a-rech3" href="#"><span class="roundies1  ongl-normalf">Onglet 3</span></a></li>
	</ul>

J'ai aussi écrit les évenements dans le HTML qui écoutent si on clique l'un des onglets, ainsi que le script JS que voici : Il efface la classe d'onglet normal (onglet-rech)et va la remplacer par celle qui rend visuellement l'onglet actif (onglet-rech-actif) ...
Fonction JS :

Code :

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

1
2
3
4
5
6
7
8
9
 
	$("#onglets-rech > li a span").removeClass("onglet-rech");
	$("#onglets-rech > li a span").removeClass("onglet-rech-actif");
	$("#onglets-rech > li a span").addClass("onglet-rech");
	$("#onglets-rech > :nth-child("+num+") a span").addClass("class","onglet-rech-actif");
 
	/* Modification du calque selon l'onglet */
	$("#forms-rech > div").hide();
	$("#forms-rech > :nth-child("+num+")").show();

Mes deux classes s'affichent bien au démarrage de la page, quand je clique sur l'un des onglets ça ne fonctionne pas comme il faudrait...
Pourtant mes classes sont bien modifiées comme prévu : j'ai testé

Code :

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

alert($("#onglets-rech > li a span").attr('class'));

il y a tout ce qu'il faut dans la balise class !

[danielhagnoul]

Bonsoir

DD_roundies est un script qui en est à la version 0.02a

Avec jQuery, je vous conseille l'usage du plug-in Corner, il en est à la version 2.11 du 15 juin 2010. Pour les navigateurs compatibles, il utilise simplement les nouvelles propriétés CSS (border radius) et il sort automatiquement l'artillerie lourde pour les navigateurs plus anciens.

[youtch]

Beaucoup plus sûre comme librairie effectivement ! Elle marche nickel dans mon cas présent après quelques modifications de mon script... c'est parfait !