Forum d'entraide


Coucou,

Merci de nous rejoindre sur le forum, j'espère que l'on passera de bons moments ensembles.

Au plaisir de te lire dans les différentes catégories.

Le Staff du forum Crea illusion Fantasy.

Forum d'entraide

Aides, Conseils, Forum, Sites web, blogs, tout supports, Graphismes, Tutoriels, Publicités.


AccueilAccueil  FAQFAQ  PortailPortail  S'enregistrerS'enregistrer  ConnexionConnexion  

Partagez|

Catégories

Voir le sujet précédent Voir le sujet suivant Aller en bas
AuteurMessage
avatar
Messages : 6795
Venue : 27/06/2009 Je suis : Féminin
Né(e) le : 17/09/1963
Age : 54
Je vie à : Lyon
Humeur : Bonne humeur
Mes Points : 10371
Fondatrice
Ptite_Perle
18 - 16
MessageSujet: Catégories Jeu 31 Mai 2018 - 12:09
Implémentation

Javascript et html

Le script se base sur jquery et sur une feuille de style spécifique utilisant deux images (+ et -). Il faut tout d'abord inclure ces éléments et y faire référence dans la page mettant en place le treeview :

Code:

<link rel="stylesheet" type="text/css" href="treeview.css" media="screen" />
<script type="text/javascript" src="jquery.js"></script>

Il faut ensuite appliquer le code javascript suivant dans la partie qui s'occupera de gérer le comportement des éléments du treeview :

Code:

<script type="text/javascript">
$(function() {
   $('div.tree div:has(div)').addClass('parent');
   $$('div.tree div').click(function() {
      var o = $(this);
      o.children('div').toggle();
      o.filter('.parent').toggleClass('expanded');
       false;
   $});
});
</script>

Finalement il ne reste plus qu'à mettre en place le code html relatif au treeview, la div parent devant avoir comme classe : "tree"
Code:

<div class='tree' style='padding:10px; border:solid 1px #dedede;'>
   <div>Catégorie 1
      <div>Sous catégorie 1
         <div>Texte élément 1</div>
         <div>Texte élément 2</div>
         <div>Texte élément 3</div>
      </div>
      <div>Sous catégorie 2</div>
      <div>Sous catégorie 3</div>
   </div>
   <div>Catégorie 2
      <div>Sous catégorie 1</div>
      <div>Sous catégorie 2
         <div>Texte élément 1</div>
         <div>Texte élément 2</div>
         <div>Texte élément 3</div>
      </div>
      <div>Sous catégorie 3</div>
   </div>
</div>


Excemple:

[Vous devez être inscrit et connecté pour voir ce lien]

[Vous devez être inscrit et connecté pour voir ce lien]
Revenir en haut Aller en bas
http://www.creaillusionfantasy.com/

Catégories

Voir le sujet précédent Voir le sujet suivant Revenir en haut
Page 1 sur 1

Sujets similaires

-
» [Nocturne] Demande: les catégories
» [Annulée] Demande de description des catégories.
» ['Christa] Regrouper les catégories en Onglet
» Niveau des catégories...
» [Phantasmagoria] Modification des catégories

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Forum d'entraide :: Astuces codages pour forumactif :: Astuces et codages forumactif-