vendredi 29 mai 2015

Collapse row on mouse click

I found one very good example of Collapsible Content on Internet but 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 I try the software before I buy it?</div></h6>
                                                <div class="answer-wrapper">
                                                    <div class="big-a">
                                                        A</div>
                                                    <div class="answer">
                                                        Yes! Simply <a href="/trial">download a free trial</a> and you&#39;ll have instant access to all features for 30 days, absolutely free. We don&#39;t require your credit card details or any commitment.</div>
                                                </div>
                                            </div>    
                                        </div>
                                    </div>
                                </div>

How I can expand or hide the answer from example when i click on the row?

Aucun commentaire:

Enregistrer un commentaire