Discussion :

[guilhemlbdc]

Bonjour Je vien chercher de l'aide ici, je suis vraiment débutant et j'ai un projet javascript a réaliser.

J'ai 4 boutons , et 4 textes, qui doivent s'afficher chacun à leur tour quand on click sur un bouton.

Voila mon HTML:

Code html :

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
<div id="fish-img">
 
//les Boutons
<div id="fish4" ><a href="#"><img src="http://localhost/abfly/wp-content/themes/theme/images/fish4.png" alt="fish"/></a></div>
<div id="fish3"><a href="#"><img src="http://localhost/abfly/wp-content/themes/theme/images/fish3.png" alt="fish"/></a></div>
<div id="fish2"><a href="#"><img src="http://localhost/abfly/wp-content/themes/theme/images/fish2.png" alt="fish"/></a></div>
<div id="fish1" ><a href="#"><img src="http://localhost/abfly/wp-content/themes/theme/images/fish.png" alt="fish"/></a></div>
</div>
<div id="texte-res">
//Les textes a afficher
<div id="texte1"><p>La société A.B.Fly est née de la rencontre de deux passions, véritables raisons d'être d'Alain Barthélémy : le montage des mouches artificielles et la pêche des salmonidées en France et à l'étranger. Déclinaison de plus de 140 modèles, les 40 000 mouches, qui sortent annuellement de son atelier, attestent du dynamisme de cette société Hollandaise, qui en quelques années, a su gagner la confiance des pêcheurs les plus exigeants. Amoureux du bel ouvrage, cultivant le goût de la perfection, Alain Barthélémy met un point d'honneur à monter chaque imitation de ses mains expertes.</p></div>
<div id="texte2" class="hidden"><p>Aussi exigeant au bord de l'eau que devant son étau, il attache une grande importance à l'efficacité de ses collections. Toutes les artificielles A.B.Fly sont, en effet, le résultat de centaines d'heures de pêche et d'une étude approfondie du milieu aquatique. Sensible à l'évolution des rivières et des mœurs de ses hôtes, ce monteur créatif s'est spécialisé dans le domaine de la micro-mouche, en proposant des imitations très élaborées de sèches et de nymphes - sur hameçons n° 20 à 26 - seules capables de faire la différence sur des poissons très éduqués.
</p></div>
<div id="texte3" class="hidden"><p>	 Restant toujours à l'écoute de ses clients, et prompt à répondre à des demandes particulières, A.B.Fly met son savoir-faire à profit pour des commandes "sur mesure", et propose par ailleurs tout une gamme de matériaux de montage dûment sélectionnés. La mise au point d'une collection complète de mouche à brochet et d'une série spécialement étudiée pour la pêche en mer, s'inscrit, quant à elle, dans cette logique d'ouverture et d'évolution que connaît, aujourd'hui, notre sport.
</p></div>
<div id="texte4" class="hidden"><p>Pariant sur la complémentarité des prestations et souhaitant vous faire profiter de son expérience personnelle, Alain Barthélemy est aussi un guide de pêche professionnel reconnu. tant pour sa disponibilité au bord de l'eau que pour ses qualités pédagogiques. En partenariat avec l'agence de voyage Planet Fly Fishing, il saura vous transmettre sa passion que ce soit en France, au bord de la loue, ou bien à l'étranger, à travers de nombreuses destinations telles que la Hollande, la Slovénie, les États-Unis ou la Guinée.</p></div>
</div>

Mon Code javascript (qui pour le moment ne marche absolument pas):

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
<script>
 $(document).ready(function(){
            $('#texte1').addClass("visible");
 
        $('#fish1').click(function() {
			alert('test');
 
            if ('#texte1'.hasClass("visible")) {
                    $('#texte1').removeClass("visible").addClass("hidden");
            } else {
                    $('#texte1').removeClass("hidden").addClass("visible");
            }
 
        });
    });
</script>

La Css des classes utiles:

Code css :

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

1
2
.hidden{display:none;}
.visible{display:block;}

[sekaijin]

si tu est débutant
utilise js et pas jquery
ce n'est pas en utilisant une lirairie qui fait plein de choses "cachées" que tu vas comprendre ce que tu fais.

A+JYT

[guilhemlbdc]

Je vais éssayer...

[Auteur]

Pour tes boutons inutile de les encadrer des balises a et div, la balise img suffit.