Menu
I would like to obtain the following effect using twitter bootstrap. One link for the collapse action, and another link for a different action:
Right now I'm getting this by setting the another link with a pull-right class and padding the item. Is there a better way?
Here's the code that matters (sorry but it's in jade, either way I think it's easily understood)
div.accordion-heading
div.row-fluid
div.span6
a.accordion-toggle(href="#", data-parent="main-accordion", data-toggle="collapse")= "Collapse Link"
div.span6
a.pull-right(style="padding:8px 15px")= "Another Link"
Best Regards
849
Expand or collapse accordion items on checkbox click in Angular Accordion component. By default, accordion items expand or collapse by clicking the accordion item header or clicking expand/collapse icon in accordion header. You can also expand or collapse the accordion items through external button click.
Just add data-toggle="collapse" and a data-target to the element to automatically assign control of one or more collapsible elements. The data-target attribute accepts a CSS selector to apply the collapse to. Be sure to add the class collapse to the collapsible element.
Flush. Add .accordion-flush to remove the default background-color , some borders, and some rounded corners to render accordions edge-to-edge with their parent container.
How do you close one accordion when another opens? open accordian > at right side go to accordian seting > scrol down to Expand/Collapse Accordion Option On Page Load > choose Hide/close All Accordion..
You might get a bit more clean with that :
div.accordion-heading
div.accordion-toggle.group-accordion-toggle
a(href="#", data-parent="main-accordion", data-toggle="collapse")= "Collapse Link"
a.pull-right= "Another Link"
And that (to avoid the pointer everywhere):
.accordion-toggle.group-accordion-toggle { cursor: inherit; }
Demo (jsfiddle)
125
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
