Bonjour,
Je souhaiterais ajouté un script jQuery dans une page wordpress qui permet de faire un lien déroulant.
Voici se que j'ai fais
- Dans le header.php du thème j'ai rajouté ceci
<script type="text/javascript" src="../js/jquery-3.3.1.js"></script>
- Dans le fichier style.css j'ai rajouté ceci
1 2 3 4
| a {display: block;}
.art{ display:none;}
.close {color:red;}
p {text-align: center;} |
- Dans le fichier header.php du thème j'ai rajouté après cette ligne wp_enqueue_script mon js
Se qui donne
1 2
| <?php wp_enqueue_script('jquery'); ?>
<script type="text/javascript" src="../js/liens-accordeon.js"></script> |
- Dans le fichier liens-accordeon.js on a ceci
1 2 3 4 5 6 7 8 9 10 11 12
| $(function(){
$('.open').on('click', function(e){
e.preventDefault();
$(this).next('.art').show(500);
$(this).hide();
})
$('.close').on('click', function(e){
e.preventDefault();
$(this).closest('.art').hide(500).prev('.open').show();
})
}) |
- Dans ma page j'ai inséré ceci
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
| <a href="" class="open">01 - Personnages</a>
<div class="art">
<p >Contenu de l'article</p>
<a href="" class="close">Fermer</a>
</div>
<!--
Séparateur article
-->
<a href="" class="open">02 - Costumes</a>
<div class="art">
<p >Contenu de l'article</p>
<a href="" class="close">Fermer</a>
</div> |
Les deux liens 01 - Personnages et 02 Costume apparaisse bien mais quand je clic dessus " Contenu de l'article " n'apparait pas.
Que dois-je faire?
Je vous en remercie d'avance.
Cordialement.
Partager