Accordions

Snippets

	<!-- Accordion . Start -->
	<ul class="accordion ml_10 mr_10 mb_30">

		<!-- Row . Start -->
		<li class="closed">

			<!-- Row . Title . Start -->
			<div class="title">[title]</div>
			<!-- Row . Title . End -->

			<!-- Row . Content . Start -->
			<div class="content">[content]</p></div>
			<!-- Row . Content . End -->

		</li>
		<!-- Row . End -->

	</ul>
	<!-- Accordion . End -->

	
Options
Type Value
Status none, 'closed'
Type Name Value
callback data-callback-initialize function Triggers on initialization
callback data-callback-close function Triggers on closing
callback data-callback-open function Triggers on opening
callback data-callback-hover function Triggers on hover
callback data-callback-hide function Triggers on hiding
callback data-callback-show function Triggers on showing
callback data-callback-title_hover function Triggers on title hover
callback data-callback-title_click function Triggers on title click
callback data-callback-content_hover function Triggers on content hover
Methods

	// Scan accordions
	basekit.components.accordions.scan(scope);
	
Parameters Value
scope null element

	// Initialize accordions
	basekit.components.accordions.initialize(scope);
	
Parameters Value
scope null element accordion(s)

	// Close accordions
	basekit.components.accordions.rows.close(scope);
	
Parameters Value
scope null element accordion(s) row(s)

	// Open accordions
	basekit.components.accordions.rows.open(scope);
	
Parameters Value
scope null element accordion(s) row(s)

	// Toggle accordions
	basekit.components.accordions.rows.toggle(scope);
	
Parameters Value
scope null element accordion(s) row(s)

	// Refresh accordions
	basekit.components.accordions.rows.refresh(scope);
	
Parameters Value
scope null element accordion(s) row(s)
Default
  • Row 1
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ultricies egestas eleifend. Nam augue orci, pretium sit amet aliquet eu, vulputate quis orci. Donec sed luctus diam.

  • Row 2
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ultricies egestas eleifend. Nam augue orci, pretium sit amet aliquet eu, vulputate quis orci. Donec sed luctus diam.

  • Row 3
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ultricies egestas eleifend. Nam augue orci, pretium sit amet aliquet eu, vulputate quis orci. Donec sed luctus diam.