javascript - Cannot hide all div contents -


i'm making collapsible/expandable divs, similar accordions, if click specific title, contents related title appear. , if click on different title, opened contents close before revealing current contents clicked title, 1 contents section open @ time. i've got sorted out.

<div class="container">     <div class="title">one</div>     <div class="content">content one</div> </div> <div class="container">     <div class="title">two</div>     <div class="content">content two</div> </div> <div class="container">     <div class="title">three</div>     <div class="content">content three</div> </div> <div class="container">     <div class="title">four</div>     <div class="content">content four</div> </div> 

however, i'm trying make divs can collapsed , contents hidden. i'm having hard time figuring part out. here's have far:

$(".title").click(function () {     $content = $(this).next();     if (!($content.is(":visible"))) {         $(".content").slideup("fast");         $content.slidetoggle(200);     } }); 

demo: http://jsfiddle.net/2skczuze/

i'm new javascript can't figure out how make expanded div collapse without opening div.

step1 :collapse content divs except current one.

step2 : toggle visiblility of current content div.

$(".title").click(function () {    $(".content").not($(this).next()).slideup();     $(this).next().slidetoggle(); }); 

fiddle


Comments

Popular posts from this blog

python - No exponential form of the z-axis in matplotlib-3D-plots -

php - Best Light server (Linux + Web server + Database) for Raspberry Pi -

c# - "Newtonsoft.Json.JsonSerializationException unable to find constructor to use for types" error when deserializing class -