collapse

API Methods

setDirection

Attribute Names

data-direction

Elements
    Properties
      Sizes
        SVG
        <img data-src="collapse.svg" class="iconic iconic-sm" alt="collapse">
        <img data-src="collapse.svg" class="iconic iconic-md" alt="collapse">
        <img data-src="collapse.svg" class="iconic iconic-lg" alt="collapse">
        
        Default Icon Font
        <span class="iconic iconic-sm" data-glyph="collapse-left" title="collapse left" aria-hidden="true"></span>
        <span class="iconic iconic-md" data-glyph="collapse-left" title="collapse left" aria-hidden="true"></span>
        <span class="iconic iconic-lg" data-glyph="collapse-left" title="collapse left" aria-hidden="true"></span>
        
        Bootstrap Icon Font
        <span class="iconic iconic-collapse-left iconic-sm" title="collapse left" aria-hidden="true"></span>
        <span class="iconic iconic-collapse-left iconic-md" title="collapse left" aria-hidden="true"></span>
        <span class="iconic iconic-collapse-left iconic-lg" title="collapse left" aria-hidden="true"></span>
        
        Foundation Icon Font
        <span class="fi-collapse-left iconic-sm" title="collapse left" aria-hidden="true"></span>
        <span class="fi-collapse-left iconic-md" title="collapse left" aria-hidden="true"></span>
        <span class="fi-collapse-left iconic-lg" title="collapse left" aria-hidden="true"></span>
        
        CSS

        Semantic SVG

        data-direction

        Sets the direction in which the collapse action takes place

        • left

          <img data-direction="left" data-src="collapse.svg" class="iconic" alt="collapse" />
          
        • right

          <img data-direction="right" data-src="collapse.svg" class="iconic" alt="collapse" />
          
        • up

          <img data-direction="up" data-src="collapse.svg" class="iconic" alt="collapse" />
          
        • down

          <img data-direction="down" data-src="collapse.svg" class="iconic" alt="collapse" />
          
        Method name

        Options/Examples

        setDirection(direction)

        left
        right
        up
        down

        Icon Font

        Iconic may be all about SVG, but it also comes with a killer font. For the full skinny, read our icon font and Bootstrap/Foundation guides.

        <!-- Default -->
        <span class="iconic" data-glyph="collapse-left" title="collapse left" aria-hidden="true"></span>
        <!-- Bootstrap -->
        <span class="iconic iconic-collapse-left" title="collapse left" aria-hidden="true"></span>
        <!-- Foundation -->
        <span class="fi-collapse-left" title="collapse left" aria-hidden="true"></span>
        
        • collapse-left

        • collapse-right

        • collapse-up

        • collapse-down

        was copied for yah