<p>Inspired by the excellent jQuery.tipsy plugin written by Jason Frame; Tooltips are an updated version, which don't rely on images, use css3 for animations, and data-attributes for local title storage.</p>
<h2>Example use of Tooltips</h2>
<h2>Examples</h2>
<p>Inspired by the excellent jQuery.tipsy plugin written by Jason Frame; Tooltips are an updated version, which don't rely on images, use CSS3 for animations, and data-attributes for local title storage.</p>
<p>Hover over the links below to see tooltips:</p>
<divclass="bs-docs-example tooltip-demo">
<pclass="muted"style="margin-bottom: 0;">Tight pants next level keffiyeh <ahref="#"rel="tooltip"title="first tooltip">you probably</a> haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel <ahref="#"rel="tooltip"title="Another tooltip">have a</a> terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney's cleanse vegan chambray. A really ironic artisan <ahref="#"rel="tooltip"title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <ahref="#"rel="tooltip"title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.
...
...
@@ -843,12 +841,9 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<p>Add small overlays of content, like those on the iPad, to any element for housing secondary information.</p>
<h2>Example</h2>
<p>Add small overlays of content, like those on the iPad, to any element for housing secondary information. Hover over the button to trigger the popover.</p>
<pclass="muted"><strong>*</strong> Requires <ahref="#tooltips">Tooltip</a> to be included</p>
<h2>Example hover popover</h2>
<p>Hover over the button to trigger the popover.</p>
<ahref="#"class="btn btn-danger"rel="popover"title="A Title"data-content="And here's some amazing content. It's very engaging. right?">hover for popover</a>
</div>
...
...
@@ -958,11 +953,9 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<p>Just add <code>data-toggle="collapse"</code> and a <code>data-target</code> to element to automatically assign control of a collapsible element. The <code>data-target</code> attribute accepts a css selector to apply the collapse to. Be sure to add the class <code>collapse</code> to the collapsible element. If you'd like it to default open, add the additional class <code>in</code>.</p>
<p>To add accordion-like group management to a collapsible control, add the data attribute <code>data-parent="#selector"</code>. Refer to the demo to see this in action.</p>
@@ -1221,18 +1230,7 @@ $('#my-alert').bind('closed', function () {
</tr>
</tbody>
</table>
<h3>Markup</h3>
<p>Just add <code>data-toggle="collapse"</code> and a <code>data-target</code> to element to automatically assign control of a collapsible element. The <code>data-target</code> attribute accepts a css selector to apply the collapse to. Be sure to add the class <code>collapse</code> to the collapsible element. If you'd like it to default open, add the additional class <code>in</code>.</p>
To add accordion-like group management to a collapsible control, add the data attribute <code>data-parent="#selector"</code>. Refer to the demo to see this in action.
</div>
<h3>Methods</h3>
<h4>.collapse(options)</h4>
...
...
@@ -1293,12 +1291,8 @@ $('#myCollapsible').on('hidden', function () {
<p>{{_i}}Inspired by the excellent jQuery.tipsy plugin written by Jason Frame; Tooltips are an updated version, which don't rely on images, use css3 for animations, and data-attributes for local title storage.{{/i}}</p>
<h2>{{_i}}Example use of Tooltips{{/i}}</h2>
<h2>{{_i}}Examples{{/i}}</h2>
<p>{{_i}}Inspired by the excellent jQuery.tipsy plugin written by Jason Frame; Tooltips are an updated version, which don't rely on images, use CSS3 for animations, and data-attributes for local title storage.{{/i}}</p>
<p>{{_i}}Hover over the links below to see tooltips:{{/i}}</p>
<divclass="bs-docs-example tooltip-demo">
<pclass="muted"style="margin-bottom: 0;">{{_i}}Tight pants next level keffiyeh <ahref="#"rel="tooltip"title="first tooltip">you probably</a> haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel <ahref="#"rel="tooltip"title="Another tooltip">have a</a> terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney's cleanse vegan chambray. A really ironic artisan <ahref="#"rel="tooltip"title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <ahref="#"rel="tooltip"title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.{{/i}}
...
...
@@ -768,12 +766,9 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<p>{{_i}}Add small overlays of content, like those on the iPad, to any element for housing secondary information.{{/i}}</p>
<h2>{{_i}}Example{{/i}}</h2>
<p>{{_i}}Add small overlays of content, like those on the iPad, to any element for housing secondary information. Hover over the button to trigger the popover.{{/i}}</p>
<pclass="muted"><strong>*</strong>{{_i}}Requires <ahref="#tooltips">Tooltip</a> to be included{{/i}}</p>
<h2>{{_i}}Example hover popover{{/i}}</h2>
<p>{{_i}}Hover over the button to trigger the popover.{{/i}}</p>
<ahref="#"class="btn btn-danger"rel="popover"title="A Title"data-content="And here's some amazing content. It's very engaging. right?">{{_i}}hover for popover{{/i}}</a>
</div>
...
...
@@ -883,11 +878,9 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<p>{{_i}}Just add <code>data-toggle="collapse"</code> and a <code>data-target</code> to element to automatically assign control of a collapsible element. The <code>data-target</code> attribute accepts a css selector to apply the collapse to. Be sure to add the class <code>collapse</code> to the collapsible element. If you'd like it to default open, add the additional class <code>in</code>.{{/i}}</p>
<p>{{_i}}To add accordion-like group management to a collapsible control, add the data attribute <code>data-parent="#selector"</code>. Refer to the demo to see this in action.{{/i}}</p>
@@ -1146,18 +1155,7 @@ $('#my-alert').bind('closed', function () {
</tr>
</tbody>
</table>
<h3>{{_i}}Markup{{/i}}</h3>
<p>{{_i}}Just add <code>data-toggle="collapse"</code> and a <code>data-target</code> to element to automatically assign control of a collapsible element. The <code>data-target</code> attribute accepts a css selector to apply the collapse to. Be sure to add the class <code>collapse</code> to the collapsible element. If you'd like it to default open, add the additional class <code>in</code>.{{/i}}</p>
{{_i}}To add accordion-like group management to a collapsible control, add the data attribute <code>data-parent="#selector"</code>. Refer to the demo to see this in action.{{/i}}
</div>
<h3>{{_i}}Methods{{/i}}</h3>
<h4>.collapse({{_i}}options{{/i}})</h4>
...
...
@@ -1218,12 +1216,8 @@ $('#myCollapsible').on('hidden', function () {
