Volevo fare in modo che cliccando sopra un elemento h3 venisse mostrato un elemento div nascosto e nel caso venisse cliccato su un altro elemento h3 il div già aperto si chiudesse e si aprisse quello corrispondente all'h3 cliccato.
Ho buttato giù due righe in jQuery ma non ottengo l'effetto sperato: i div rimangono aperti tutti!
Dove sbaglio?
codice:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1250"> <meta name="generator" content="PSPad editor, www.pspad.com"> <title>Show/hide</title> <script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript" language="javascript"> $(document).ready(function() { //hide the all of the element with class msg_body $("div.msg_body").hide(); //toggle the componenet with class msg_body $("h3.msg_head").click(function() { $(this).next("div.msg_body").slideToggle(300).siblings("div.msg_body").slideUp("slow"); }); }); </script> </head> <body> <ul class="lista-verticale">[*]<h3 class="msg_head">Studio del mercato</h3> <div class="msg_body">conoscenza del settore...</div> [*]<h3 class="msg_head">Sondaggio</h3> <div class="msg_body">scoprire l’effettiva situazione di mercato...</div> [*]<h3 class="msg_head">Analisi dei dati</h3> <div class="msg_body">Analizzare i dati del sondaggio...</div> [*]<h3 class="msg_head">Strategia di Marketing</h3> <div class="msg_body">Individuare un piano...</div> [*]<h3 class="msg_head">Creatività e comunicazione</h3> <div class="msg_body">Ideare una comunicazione creativa...</div> [/list] </body> </html>
Rispondi quotando