2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-05 16:42:29 +03:00

overhaul js docs top sections, update subhead

This commit is contained in:
Mark Otto
2012-06-07 22:24:47 -07:00
parent 97c7a83a8f
commit 269ce715f1
3 changed files with 61 additions and 127 deletions
+30 -63
View File
@@ -22,69 +22,36 @@
<!-- Using Javascript w/ Bootstrap
================================================== -->
<section id="javascript">
<div class="page-header">
<h1>{{_i}}jQuery plugins{{/i}} <small>{{_i}}A dozen Bootstrap plugins to get you started{{/i}}</small></h1>
</div>
<div class="row">
<div class="span4">
<h3><a href="./javascript.html#modals">{{_i}}Modals{{/i}}</a></h3>
<p>{{_i}}A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.{{/i}}</p>
</div>
<div class="span4">
<h3><a href="./javascript.html#dropdowns">{{_i}}Dropdowns{{/i}}</a></h3>
<p>{{_i}}Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.{{/i}}</p>
</div>
<div class="span4">
<h3><a href="./javascript.html#scrollspy">{{_i}}Scrollspy{{/i}}</a></h3>
<p>{{_i}}Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.{{/i}}</p>
</div>
<div class="span4">
<h3><a href="./javascript.html#tabs">{{_i}}Togglable tabs{{/i}}</a></h3>
<p>{{_i}}Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.{{/i}}</p>
</div>
</div> <!-- /row -->
<div class="row">
<div class="span4">
<h3><a href="./javascript.html#tooltips">{{_i}}Tooltips{{/i}}</a></h3>
<p>{{_i}}A new take on the jQuery Tipsy plugin, Tooltips don't rely on images&mdash;they use CSS3 for animations and data-attributes for local title storage.{{/i}}</p>
</div>
<div class="span4">
<h3><a href="./javascript.html#popovers">{{_i}}Popovers{{/i}}</a> <small class="muted">*</small></h3>
<p>{{_i}}Add small overlays of content, like those on the iPad, to any element for housing secondary information.{{/i}}</p>
<p class="muted"><strong>*</strong> {{_i}}Requires <a href="#tooltips">Tooltips</a> to be included{{/i}}</p>
</div>
<div class="span4">
<h3><a href="./javascript.html#alerts">{{_i}}Alert messages{{/i}}</a></h3>
<p>{{_i}}The alert plugin is a tiny class for adding close functionality to alerts.{{/i}}</p>
</div>
<div class="span4">
<h3><a href="./javascript.html#buttons">{{_i}}Buttons{{/i}}</a></h3>
<p>{{_i}}Do more with buttons. Control button states or create groups of buttons for more components like toolbars.{{/i}}</p>
</div>
</div> <!-- /row -->
<div class="row" style="margin-bottom: 9px;">
<div class="span4">
<h3><a href="./javascript.html#collapse">{{_i}}Collapse{{/i}}</a></h3>
<p>{{_i}}Get base styles and flexible support for collapsible components like accordions and navigation.{{/i}}</p>
</div>
<div class="span4">
<h3><a href="./javascript.html#carousel">{{_i}}Carousel{{/i}}</a></h3>
<p>{{_i}}Create a merry-go-round of any content you wish to provide an interactive slideshow of content.{{/i}}</p>
</div>
<div class="span4">
<h3><a href="./javascript.html#typeahead">Typeahead</a></h3>
<p>{{_i}}A basic, easily extended plugin for quickly creating elegant typeaheads with any form text input.{{/i}}</p>
</div>
<div class="span4">
<h3>{{_i}}Transitions{{/i}} <small class="muted">*</small></h3>
<p>{{_i}}For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.{{/i}}</p>
<p class="muted"><strong>*</strong> {{_i}}Required for animation in plugins{{/i}}</p>
</div>
</div> <!-- /row -->
<div class="alert alert-info"><strong>{{_i}}Heads up!{{/i}}</strong> {{_i}} If you have downloaded the latest version of Bootstrap, both <strong>bootstrap.js</strong> and <strong>bootstrap.min.js</strong> contain all of these plugins.{{/i}}</div>
<!-- Overview
================================================== -->
<section id="overview">
<div class="page-header">
<h1>{{_i}}Javascript in Bootstrap{{/i}}</h1>
</div>
<h3>{{_i}}Individual or compiled{{/i}}</h3>
<p>{{_i}}If you have downloaded the latest version of Bootstrap, both <strong>bootstrap.js</strong> and <strong>bootstrap.min.js</strong> contain all of these plugins.{{/i}}</p>
<h3>{{_i}}Data attributea{{/i}}</h3>
<p>{{_i}}...{{/i}}</p>
<h3>{{_i}}Programmatic API{{/i}}</h3>
<p>{{_i}}...{{/i}}</p>
{{! Thought: consider porting much of the JS readme here? }}
</section>
<!-- Transitions
================================================== -->
<section id="modals">
<div class="page-header">
<h1>{{_i}}Transitions{{/i}} <small>bootstrap-transition.js</small></h1>
</div>
<h3>{{_i}}About transitions{{/i}}</h3>
<p>{{_i}}For simple transition effects, include bootstrap-transition.js once to slide in modals or fade out alerts.{{/i}}</p>
<p class="muted"><strong>*</strong> {{_i}}Required for animation in plugins{{/i}}</p>
</section>