Contents

/*

Toggle

Toggle visibility using `.open` class between elements of a container.

Script required: **rapido.js**.

    <section class="news">
      <article>
        <h3 data-toggle-name="news_1">News title</h3>
        <p data-toggle-content="news_1">News content</p>
      </article>
      <article>
        <h3 data-toggle-name="news_2">News title</h4>
        <p data-toggle-content="news_2">News content</p>
      </article>
    </section>

Include this js after including rapido.js.

    $('.news').rapido_Toggle();

You can also pass a delay between the removing and adding the class, usefull
when you have two animation that you don't wont to start at the same time.

**Options** (with default values):

    titleClass:    [data-toggle-name]
    contentClass:  [data-toggle-content]
    delay:         500
    closable:      true        # Enable/disable the ability to close all panels

Remeber to add closed and open state in the css, this module doesn't have
default styling, es:

    [data-toggle-content]       { @extend %display-none; }
    [data-toggle-content].open  { @extend %display-block; }

Styleguide 17

*/

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
rapido-css-0.2.4	stylesheets/components/_toggle.scss
rapido-css-0.2.3	stylesheets/components/_toggle.scss