kotovalexarian-likes-github
/
twbs--bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Releases Activity

adds small js section to docs index

This commit is contained in:
Jacob Thornton 2011-09-02 23:15:38 -07:00
parent 3c9c85b1ed
commit 2883888a57
2 changed files with 34 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
docs/index.html
View File

@ -48,6 +48,7 @@
<li><a href="#navigation">Navigation</a></li>
<li><a href="#alerts">Alerts</a></li>
<li><a href="#popovers">Popovers</a></li>
<li><a href="#javascript">Javascript</a></li>
<li><a href="#less">Less</a></li>
</ul>
</div>
@ -1245,6 +1246,38 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
</section>
<!-- Using Javascript w/ Bootstrap
================================================== -->
<section id="javascript">
<div class="page-header">
<h1>Using Javascript with Bootstrap <small>An index of plugins to get you started</small></h1>
</div>
<div class="row">
<div class="span4 columns">
<p>Integrating javascript with the Bootstrap library is super easy. Below we go over the basics and provide you with some awesome plugins to get you started!</p>
</div>
<div class="span12 columns">
<h2>Getting started</h2>
<p>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 either <a href="http://jquery.com/" target="_blank">jQuery</a> or <a href="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 javascript?</h2>
<p>The short answer is <strong>no</strong>... of course not! However, for those who need it, we've provided the plugins below 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 right away! For more information on these plugins and to see demos of them in action, please refer to our <a href="../examples/javascript.html">plugin documentation page</a>.
<dl>
<dt><a href="../examples/javascript.html#modal">bootstrap-modal.js</a></dt>
<dd>Our Modal plugin is a <strong>super</strong> slim take on the traditional modal js plugin! We took special care to include only the bare functionality that we require at twitter.</dd>
<dt><a href="../examples/javascript.html#alerts">bootstrap-alerts.js</a></dt>
<dd>The alert plugin is a super tiny class for adding close functionality to alerts.</dd>
<dt><a href="../examples/javascript.html#dropdowns">bootstrap-dropdown.js</a></dt>
<dd>This plugin is for adding dropdown to the bootstrap nav.</dd>
<dt><a href="../examples/javascript.html#twipsy">bootstrap-twipsy.js</a></dt>
<dd>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!</dd>
<dt><a href="../examples/javascript.html#popover">bootstrap-popover.js</a></dt>
<dd>The popover plugin provides a simple interface for adding popovers to your application. It extends the <a href="#twipsy">boostrap-twipsy.js</a> plugin, so be sure to grab that file as well when including popovers in your project!</dd>
</dl>
</p>
</div>
</div>
<!-- Using Bootstrap w/ Less
================================================== -->

25
examples/javascript.html
View File

@ -42,7 +42,6 @@
<div class="container">
<h3><a href="#">Bootstrap JS</a></h3>
<ul>
<li><a href="#javascript">Getting Started</a></li>
<li><a href="#modal">Modals</a></li>
<li><a href="#alerts">Alerts</a></li>
<li><a href="#dropdown">Dropdown</a></li>
@ -55,28 +54,6 @@
<div class="container">
<!-- Using Javascript w/ Bootstrap
================================================== -->
<section id="javascript">
<div class="page-header">
<h1>Using Javascript with Bootstrap <small>An index of plugins to get you started</small></h1>
</div>
<div class="row">
<div class="span4 columns">
<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>
</div>
<div class="span12 columns">
<h2>What is this all about?</h2>
<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 either <a href="http://jquery.com/" target="_blank">jQuery</a> or <a href="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. So please, roll your own and let us know how it went!
</p>
</div>
</div>
</section>
<!-- Modal
================================================== -->
@ -199,7 +176,7 @@ $('#modal-content').modal({
</div>
<div class="row">
<div class="span4 columns">
<p>This plugin is for adding dropdown to the bootstrap nav.</p>
<p>This plugin is for adding dropdowns to the bootstrap nav.</p>
<a href="assets/js/bootstrap-dropdown.js" target="_blank" class="btn primary">Download</a>
</div>
<div class="span12 columns">