javascript - Collapse row on mouse click -


i found 1 example of collapsible content on internet it's unfinished.

<div class="container faq_wrapper">     <div class="row">         <div class="span10 offset1">             <p>                 &nbsp;</p>             <div class="faq-all-actions">                 <a class="faq-expand" onclick="jquery('.answer-wrapper').css('display','block');">expand all</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a class="faq-collapse" onclick="jquery('.answer-wrapper').css('display','none');">collapse all</a></div>         </div>     </div>     <div class="row">         <div class="span10 offset1">             <div class="question-wrapper">                 <div class="arrow">                     &nbsp;</div>                 <div class="big-q">                     q</div>                 <div class="question">                     <h6>can try software before buy it?</div></h6>                 <div class="answer-wrapper">                     <div class="big-a">                         a</div>                     <div class="answer">                         yes! <a href="/trial">download free trial</a> , you&#39;ll have instant access features 30 days, absolutely free. don&#39;t require credit card details or commitment.</div>                 </div>             </div>             </div>     </div> </div> 

how can expand or hide answer example when click on row?

bind click event row , hide/show child using .find()

<style>     .answer-wrapper {         display: none;     } </style>  $(document)     .on('click','.row',function(){          $(this).find('.answer-wrapper').slidetoggle();     }) ; 

http://jsfiddle.net/7bz5au97/

if bind event document, won't have worry dom changing due ajax calls or dynamic content.


Comments

Popular posts from this blog

Java 3D LWJGL collision -

spring - SubProtocolWebSocketHandler - No handlers -

methods - python can't use function in submodule -