Skip to content

B
bootstrap
Commit bed8e959 authored by Mark Otto's avatar Mark Otto
Browse files
Options

responsive tables all up in js docs

parent bf5434db
Show whitespace changes
Inline Side-by-side
Showing with 463 additions and 433 deletions
javascript.html
View file @ bed8e959
......@@ -228,6 +228,7 @@ $('#myModal').on('show.bs.modal', function (e) {
<h3>Options</h3>
<p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-backdrop=""</code>.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -267,6 +268,7 @@ $('#myModal').on('show.bs.modal', function (e) {
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
<h3>Methods</h3>
......@@ -292,6 +294,7 @@ $('#myModal').modal({
<h3>Events</h3>
<p>Bootstrap's modal class exposes a few events for hooking into modal functionality.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -318,6 +321,7 @@ $('#myModal').modal({
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
{% highlight js %}
$('#myModal').on('hidden.bs.modal', function () {
// do something…
......@@ -546,6 +550,7 @@ $('[data-spy="scroll"]').each(function () {
<h3>Options</h3>
<p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-offset=""</code>.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -564,8 +569,10 @@ $('[data-spy="scroll"]').each(function () {
</tr>
</tbody>
</table>
</div><!-- ./bs-table-scrollable -->
<h3>Events</h3>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -580,6 +587,7 @@ $('[data-spy="scroll"]').each(function () {
</tr>
</tbody>
</table>
</div><!-- ./bs-table-scrollable -->
{% highlight js %}
$('#myScrollspy').on('activate.bs.scrollspy', function () {
// do something…
......@@ -685,6 +693,7 @@ $('#myTab li:eq(2) a').tab('show'); // Select third tab (0-indexed)
{% endhighlight %}
<h3>Events</h3>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -703,6 +712,7 @@ $('#myTab li:eq(2) a').tab('show'); // Select third tab (0-indexed)
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
{% highlight js %}
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
e.target // activated tab
......@@ -752,6 +762,7 @@ $('#example').tooltip(options)
<h3>Options</h3>
<p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-animation=""</code>.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -818,6 +829,7 @@ $('#example').tooltip(options)
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
<div class="bs-callout bs-callout-info">
<h4>Data attributes for individual tooltips</h4>
<p>Options for individual tooltips can alternatively be specified through the use of data attributes, as explained above.</p>
......@@ -850,6 +862,7 @@ $('#example').tooltip(options)
{% highlight js %}$('#element').tooltip('destroy'){% endhighlight %}
<h3>Events</h3>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -876,6 +889,7 @@ $('#example').tooltip(options)
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
{% highlight js %}
$('#myTooltip').on('hidden.bs.tooltip', function () {
// do something…
......@@ -970,6 +984,7 @@ $('#myTooltip').on('hidden.bs.tooltip', function () {
<h3>Options</h3>
<p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-animation=""</code>.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -1042,6 +1057,7 @@ $('#myTooltip').on('hidden.bs.tooltip', function () {
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
<div class="bs-callout bs-callout-info">
<h4>Data attributes for individual popovers</h4>
<p>Options for individual popovers can alternatively be specified through the use of data attributes, as explained above.</p>
......@@ -1070,6 +1086,7 @@ $('#myTooltip').on('hidden.bs.tooltip', function () {
<p>Hides and destroys an element's popover.</p>
{% highlight js %}$('#element').popover('destroy'){% endhighlight %}
<h3>Events</h3>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -1096,6 +1113,7 @@ $('#myTooltip').on('hidden.bs.tooltip', function () {
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
{% highlight js %}
$('#myPopover').on('hidden.bs.popover', function () {
// do something…
......@@ -1152,6 +1170,7 @@ $('#myPopover').on('hidden.bs.popover', function () {
<h3>Events</h3>
<p>Bootstrap's alert class exposes a few events for hooking into alert functionality.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -1170,6 +1189,7 @@ $('#myPopover').on('hidden.bs.popover', function () {
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
{% highlight js %}
$('#my-alert').bind('closed.bs.alert', function () {
// do something…
......@@ -1444,6 +1464,7 @@ $(".collapse").collapse()
<h3>Options</h3>
<p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-parent=""</code>.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -1468,7 +1489,7 @@ $(".collapse").collapse()
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
<h3>Methods</h3>
......@@ -1491,6 +1512,7 @@ $('#myCollapsible').collapse({
<h3>Events</h3>
<p>Bootstrap's collapse class exposes a few events for hooking into collapse functionality.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -1519,6 +1541,7 @@ $('#myCollapsible').collapse({
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
{% highlight js %}
$('#myCollapsible').on('hidden.bs.collapse', function () {
// do something…
......@@ -1661,6 +1684,7 @@ $('.carousel').carousel()
<h3>Options</h3>
<p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-interval=""</code>.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -1685,6 +1709,7 @@ $('.carousel').carousel()
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
<h3>Methods</h3>
......@@ -1714,6 +1739,7 @@ $('.carousel').carousel({
<h3>Events</h3>
<p>Bootstrap's carousel class exposes two events for hooking into carousel functionality.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -1732,6 +1758,7 @@ $('.carousel').carousel({
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
{% highlight js %}
$('#myCarousel').on('slide.bs.carousel', function () {
// do something…
......@@ -1787,6 +1814,7 @@ $('#myCarousel').on('slide.bs.carousel', function () {
<h3>Options</h3>
<p>Options can be passed via data attributes or JavaScript. For data attributes, append the option name to <code>data-</code>, as in <code>data-offset-top="200"</code>.</p>
<div class="bs-table-scrollable">
<table class="table table-bordered table-striped">
<thead>
<tr>
......@@ -1805,4 +1833,6 @@ $('#myCarousel').on('slide.bs.carousel', function () {
</tr>
</tbody>
</table>
</div><!-- /.bs-table-scrollable -->
</div>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment