<p>This page illustrates how to integrate javascript with the Bootstrap library. Below we go over the basics and provide you with some awesome plugins to get you started!</p>
<p>With this example page, we've set out to make your interactive work with Bootstrap even more simple, offering several lightweight plugins for things like modals, tooltips, and other dynamic components. These plugins have been coded up to work with <ahref="http://jquery.com/"target="_blank">jQuery</a> and <ahref="http://ender.no.de"target="_blank">Ender</a>, but we encourage you to extend and modify them to fit your development needs!</p>
<h2>Do I need these?</h2>
<p>The short answer is <strong>NO!</strong> These plugins were provided to help you understand how to integrate bootstrap with javascript and to give you a quick lightweight option for dropping something in and getting the basic functionality.
<p>Our Modal plugin is <strong>super</strong> slim! We took special care to only include the bare functionality that we require at twitter, however we look forward to seeing all the cool stuff you do with it!</p>
<p>Returns an instance of the modal class. Accepts an optional options <code>object</code>. If you want your modal to fade in and out, just add a <code>.fade</code> class to your <code>.modal</code> element (refer to the demo to see this in action).</p>
<p>Wraps all alerts with close functionality. To have your alerts animate out when closed, make sure they have the <code>.fade</code> and <code>.in</code> class already applied to them.</p>
<p><strong>Oh snap! You got an error!</strong> Change this and that and try again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.</p>
<divclass="alert-actions">
<aclass="btn small"href="#">Take this action</a><aclass="btn small"href="#">Or do this</a>
<p>Based on the excellent jQuery.tipsy plugin written by Jason Frame; twipsy is an updated version, which doesn't rely on images, uses css3 for animations, and data-attributes for title storage!</p>
<p>The popover plugin provides a simple interface for adding popovers to your application. It extends the <ahref="#twipsy">boostrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</p>
<li><strong>delayIn</strong> (<code>number</code>) - delay before showing tooltip (ms).</li>
<li><strong>delayOut</strong> (<code>number</code>) - delay before hiding tooltip (ms).</li>
<li><strong>fallback</strong> (<code>string</code>) - fallback text to use when no tooltip text.</li>
<li><strong>placement</strong> (<code>string</code>) - position of tooltip - above | below | left | right.</li>
<li><strong>html</strong> (<code>boolean</code>) - is tooltip content HTML?</li>
<li><strong>live</strong> (<code>boolean</code>) - use live event support?</li>
<li><strong>offset</strong> (<code>number</code>) - pixel offset of tooltip from element.</li>
<li><strong>title</strong> (<code>string|function</code>) - text for title in popover. Alternatively you can specify a <code>data-title</code> attribute.</li>
<li><strong>content</strong> (<code>string|function</code>) - text for content in popover. Also you can specify a <code>data-content</code> attibute.</li>
<li><strong>trigger</strong> (<code>string</code>) - how tooltip is triggered - hover | focus | manual.</li>
</ul>
<h3>Methods</h3>
<h4>$().popover</h4>
<p>Initializes popovers for an element collection.</p>
<h3>Demo</h3>
<ahref="#"class="btn"rel="popover"data-title="A Title"data-content="And here's some amazing content. It's very engaging. right?">hover</a>
