Clone this repo:
  1. 98d2c27 Merge pull request #1 from dansterrett/master by Justin D'Arcangelo · 10 years ago master
  2. 14d0cbf Updated styles for rotate3d to specify the axis to rotate. by Dan Sterrett · 10 years ago
  3. 69bdd54 Updated styles to use rotate3d for webkit, and removed translate3d and perspective for non-webkit browsers. Fixed modal close button on demo page. by Dan Sterrett · 10 years ago
  4. d07668c Changed the styles to use a translate3d transform to move the notecards rather than top. This change makes the animation much smoother on iPad. by Dan Sterrett · 10 years ago
  5. c60f473 Fixed issue where the drawer wasn't correctly closing when a notecard is clicked. by Justin D'Arcangelo · 11 years ago

Bootstrap Flyout List

Creates an animated, styled list for the sidebar in Bootstrap for launching modals.

Usage

Simply drop the CSS onto any page:

<link rel="stylesheet" type="text/css" href="bootstrap.css"/>
<link rel="stylesheet" type="text/css" href="bootstrap-flyout-list.css"/>

To style the sidebar list, simply add the "flyout-list" class to it and wrap each list item's contents with a ...:

<div class="sidebar">
  <ul class="flyout-list">
    <li><a href="#"><span class="flyout-list-card">Item 1</span></a></li>
    <li><a href="#"><span class="flyout-list-card">Item 2</span></a></li>
    <li><a href="#"><span class="flyout-list-card">Item 3</span></a></li>
    <li><a href="#"><span class="flyout-list-card">Item 4</span></a></li>
    <li><a href="#"><span class="flyout-list-card">Item 5</span></a></li>
    <li><a href="#"><span class="flyout-list-card">Item 6</span></a></li>
    <li><a href="#"><span class="flyout-list-card">Item 7</span></a></li>
    <li><a href="#"><span class="flyout-list-card">Item 8</span></a></li>
    <li><a href="#"><span class="flyout-list-card">Item 9</span></a></li>
    <li><a href="#"><span class="flyout-list-card">Item 10</span></a></li>
  <ul>
</div>

License

Copyright 2011 Entropi Software, LLC.

Licensed under the Apache License, Version 2.0: http://www.apache.org/licenses/LICENSE-2.0