@@ -769,17 +769,17 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
...
@@ -769,17 +769,17 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<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>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>
<p>Hover over the links below to see tooltips:</p>
<divclass="bs-docs-example tooltip-demo">
<divclass="bs-docs-example tooltip-demo">
<pclass="muted"style="margin-bottom: 0;">Tight pants next level keffiyeh <ahref="#"rel="tooltip"title="Default 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.
<pclass="muted"style="margin-bottom: 0;">Tight pants next level keffiyeh <ahref="#"data-toggle="tooltip"title="Default 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="#"data-toggle="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="#"data-toggle="tooltip"title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <ahref="#"data-toggle="tooltip"title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.
</p>
</p>
</div>
</div>
<h3>Four directions</h3>
<h3>Four directions</h3>
<divclass="bs-docs-example tooltip-demo">
<divclass="bs-docs-example tooltip-demo">
<ulclass="bs-docs-tooltip-examples">
<ulclass="bs-docs-tooltip-examples">
<li><ahref="#"rel="tooltip"data-placement="top"title="Tooltip on top">Tooltip on top</a></li>
<li><ahref="#"data-toggle="tooltip"data-placement="top"title="Tooltip on top">Tooltip on top</a></li>
<li><ahref="#"rel="tooltip"data-placement="right"title="Tooltip on right">Tooltip on right</a></li>
<li><ahref="#"data-toggle="tooltip"data-placement="right"title="Tooltip on right">Tooltip on right</a></li>
<li><ahref="#"rel="tooltip"data-placement="bottom"title="Tooltip on bottom">Tooltip on bottom</a></li>
<li><ahref="#"data-toggle="tooltip"data-placement="bottom"title="Tooltip on bottom">Tooltip on bottom</a></li>
<li><ahref="#"rel="tooltip"data-placement="left"title="Tooltip on left">Tooltip on left</a></li>
<li><ahref="#"data-toggle="tooltip"data-placement="left"title="Tooltip on left">Tooltip on left</a></li>
</ul>
</ul>
</div>
</div>
...
@@ -836,8 +836,8 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
...
@@ -836,8 +836,8 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<ahref="#"class="btn btn-large btn-danger"rel="popover"title="A Title"data-content="And here's some amazing content. It's very engaging. right?">Click to toggle popover</a>
<ahref="#"class="btn btn-large btn-danger"data-toggle="popover"title="A Title"data-content="And here's some amazing content. It's very engaging. right?">Click to toggle popover</a>
</div>
</div>
<h4>Four directions</h4>
<h4>Four directions</h4>
<divclass="bs-docs-example tooltip-demo">
<divclass="bs-docs-example tooltip-demo">
<ulclass="bs-docs-tooltip-examples">
<ulclass="bs-docs-tooltip-examples">
<li><ahref="#"class="btn"rel="popover"data-placement="top"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on top">Popover on top</a></li>
<li><ahref="#"class="btn"data-toggle="popover"data-placement="top"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on top">Popover on top</a></li>
<li><ahref="#"class="btn"rel="popover"data-placement="right"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on right">Popover on right</a></li>
<li><ahref="#"class="btn"data-toggle="popover"data-placement="right"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on right">Popover on right</a></li>
<li><ahref="#"class="btn"rel="popover"data-placement="bottom"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on bottom">Popover on bottom</a></li>
<li><ahref="#"class="btn"data-toggle="popover"data-placement="bottom"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on bottom">Popover on bottom</a></li>
<li><ahref="#"class="btn"rel="popover"data-placement="left"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on left">Popover on left</a></li>
<li><ahref="#"class="btn"data-toggle="popover"data-placement="left"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on left">Popover on left</a></li>
</ul>
</ul>
</div>
</div>
...
@@ -1423,9 +1431,9 @@ $('#myCollapsible').on('hidden', function () {
...
@@ -1423,9 +1431,9 @@ $('#myCollapsible').on('hidden', function () {
@@ -1480,14 +1493,14 @@ $('#myCollapsible').on('hidden', function () {
...
@@ -1480,14 +1493,14 @@ $('#myCollapsible').on('hidden', function () {
<h2>Usage</h2>
<h2>Usage</h2>
<h3>Via data attributes</h3>
<h3>Via data attributes</h3>
<p>...</p>
<p>Use data attributes to easily control the position of the carousel. <code>data-slide</code> accepts the keywords <code>prev</code> or <code>next</code>, which alters the slide position relative to it's current position. Alternatively, use <code>data-slide-to</code> to pass a raw slide index to the carousel <code>data-slide-to="2"</code>, which jump's the slide position to a particular index beginning with <code>0</code>.</p>
<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>
<p>Options can be passed via data attributes or JavaScriptz. For data attributes, append the option name to <code>data-</code>, as in <code>data-interval=""</code>.</p>
@@ -699,17 +699,17 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
...
@@ -699,17 +699,17 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<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}}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>
<p>{{_i}}Hover over the links below to see tooltips:{{/i}}</p>
<divclass="bs-docs-example tooltip-demo">
<divclass="bs-docs-example tooltip-demo">
<pclass="muted"style="margin-bottom: 0;">{{_i}}Tight pants next level keffiyeh <ahref="#"rel="tooltip"title="Default 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}}
<pclass="muted"style="margin-bottom: 0;">{{_i}}Tight pants next level keffiyeh <ahref="#"data-toggle="tooltip"title="Default 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="#"data-toggle="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="#"data-toggle="tooltip"title="Another one here too">whatever keytar</a>, scenester farm-to-table banksy Austin <ahref="#"data-toggle="tooltip"title="The last tip!">twitter handle</a> freegan cred raw denim single-origin coffee viral.{{/i}}
</p>
</p>
</div>{{! /example }}
</div>{{! /example }}
<h3>{{_i}}Four directions{{/i}}</h3>
<h3>{{_i}}Four directions{{/i}}</h3>
<divclass="bs-docs-example tooltip-demo">
<divclass="bs-docs-example tooltip-demo">
<ulclass="bs-docs-tooltip-examples">
<ulclass="bs-docs-tooltip-examples">
<li><ahref="#"rel="tooltip"data-placement="top"title="Tooltip on top">Tooltip on top</a></li>
<li><ahref="#"data-toggle="tooltip"data-placement="top"title="Tooltip on top">Tooltip on top</a></li>
<li><ahref="#"rel="tooltip"data-placement="right"title="Tooltip on right">Tooltip on right</a></li>
<li><ahref="#"data-toggle="tooltip"data-placement="right"title="Tooltip on right">Tooltip on right</a></li>
<li><ahref="#"rel="tooltip"data-placement="bottom"title="Tooltip on bottom">Tooltip on bottom</a></li>
<li><ahref="#"data-toggle="tooltip"data-placement="bottom"title="Tooltip on bottom">Tooltip on bottom</a></li>
<li><ahref="#"rel="tooltip"data-placement="left"title="Tooltip on left">Tooltip on left</a></li>
<li><ahref="#"data-toggle="tooltip"data-placement="left"title="Tooltip on left">Tooltip on left</a></li>
</ul>
</ul>
</div>{{! /example }}
</div>{{! /example }}
...
@@ -747,7 +747,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
...
@@ -747,7 +747,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
</tr>
</tr>
<tr>
<tr>
<td>{{_i}}placement{{/i}}</td>
<td>{{_i}}placement{{/i}}</td>
<td>{{_i}}string|function{{/i}}</td>
<td>{{_i}}string | function{{/i}}</td>
<td>'top'</td>
<td>'top'</td>
<td>{{_i}}how to position the tooltip{{/i}} - top | bottom | left | right</td>
<td>{{_i}}how to position the tooltip{{/i}} - top | bottom | left | right</td>
</tr>
</tr>
...
@@ -766,8 +766,8 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
...
@@ -766,8 +766,8 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<td>{{_i}}how tooltip is triggered{{/i}} - click | hover | focus | manual. {{_i}}Note you case pass trigger mutliple, space seperated, trigger types.{{/i}}</td>
</tr>
</tr>
<tr>
<tr>
<td>{{_i}}delay{{/i}}</td>
<td>{{_i}}delay{{/i}}</td>
...
@@ -779,6 +779,14 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
...
@@ -779,6 +779,14 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<p>{{_i}}Object structure is: <code>delay: { show: 500, hide: 100 }</code>{{/i}}</p>
<p>{{_i}}Object structure is: <code>delay: { show: 500, hide: 100 }</code>{{/i}}</p>
</td>
</td>
</tr>
</tr>
<tr>
<td>{{_i}}container{{/i}}</td>
<td>{{_i}}string | false{{/i}}</td>
<td>{{_i}}false{{/i}}</td>
<td>
<p>{{_i}}Appends the tooltip to a specific element <code>container: 'body'</code>{{/i}}</p>
</td>
</tr>
</tbody>
</tbody>
</table>
</table>
<divclass="alert alert-info">
<divclass="alert alert-info">
...
@@ -788,7 +796,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
...
@@ -788,7 +796,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<h3>{{_i}}Markup{{/i}}</h3>
<h3>{{_i}}Markup{{/i}}</h3>
<p>{{_i}}For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a selector option.{{/i}}</p>
<p>{{_i}}For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a selector option.{{/i}}</p>
<preclass="prettyprint linenums"><a href="#" rel="tooltip" title="{{_i}}first tooltip{{/i}}">{{_i}}hover over me{{/i}}</a></pre>
<preclass="prettyprint linenums"><a href="#" data-toggle="tooltip" title="{{_i}}first tooltip{{/i}}">{{_i}}hover over me{{/i}}</a></pre>
<h3>{{_i}}Methods{{/i}}</h3>
<h3>{{_i}}Methods{{/i}}</h3>
<h4>$().tooltip({{_i}}options{{/i}})</h4>
<h4>$().tooltip({{_i}}options{{/i}})</h4>
...
@@ -860,16 +868,16 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
...
@@ -860,16 +868,16 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<ahref="#"class="btn btn-large btn-danger"rel="popover"title="A Title"data-content="And here's some amazing content. It's very engaging. right?">{{_i}}Click to toggle popover{{/i}}</a>
<ahref="#"class="btn btn-large btn-danger"data-toggle="popover"title="A Title"data-content="And here's some amazing content. It's very engaging. right?">{{_i}}Click to toggle popover{{/i}}</a>
</div>
</div>
<h4>{{_i}}Four directions{{/i}}</h4>
<h4>{{_i}}Four directions{{/i}}</h4>
<divclass="bs-docs-example tooltip-demo">
<divclass="bs-docs-example tooltip-demo">
<ulclass="bs-docs-tooltip-examples">
<ulclass="bs-docs-tooltip-examples">
<li><ahref="#"class="btn"rel="popover"data-placement="top"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on top">Popover on top</a></li>
<li><ahref="#"class="btn"data-toggle="popover"data-placement="top"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on top">Popover on top</a></li>
<li><ahref="#"class="btn"rel="popover"data-placement="right"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on right">Popover on right</a></li>
<li><ahref="#"class="btn"data-toggle="popover"data-placement="right"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on right">Popover on right</a></li>
<li><ahref="#"class="btn"rel="popover"data-placement="bottom"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on bottom">Popover on bottom</a></li>
<li><ahref="#"class="btn"data-toggle="popover"data-placement="bottom"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on bottom">Popover on bottom</a></li>
<li><ahref="#"class="btn"rel="popover"data-placement="left"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on left">Popover on left</a></li>
<li><ahref="#"class="btn"data-toggle="popover"data-placement="left"data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus."title="Popover on left">Popover on left</a></li>
</ul>
</ul>
</div>{{! /example }}
</div>{{! /example }}
...
@@ -907,7 +915,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
...
@@ -907,7 +915,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
</tr>
</tr>
<tr>
<tr>
<td>{{_i}}placement{{/i}}</td>
<td>{{_i}}placement{{/i}}</td>
<td>{{_i}}string|function{{/i}}</td>
<td>{{_i}}string | function{{/i}}</td>
<td>'right'</td>
<td>'right'</td>
<td>{{_i}}how to position the popover{{/i}} - top | bottom | left | right</td>
<td>{{_i}}how to position the popover{{/i}} - top | bottom | left | right</td>
</tr>
</tr>
...
@@ -1353,9 +1361,9 @@ $('#myCollapsible').on('hidden', function () {
...
@@ -1353,9 +1361,9 @@ $('#myCollapsible').on('hidden', function () {
@@ -1410,14 +1423,14 @@ $('#myCollapsible').on('hidden', function () {
...
@@ -1410,14 +1423,14 @@ $('#myCollapsible').on('hidden', function () {
<h2>{{_i}}Usage{{/i}}</h2>
<h2>{{_i}}Usage{{/i}}</h2>
<h3>{{_i}}Via data attributes{{/i}}</h3>
<h3>{{_i}}Via data attributes{{/i}}</h3>
<p>{{_i}}...{{/i}}</p>
<p>{{_i}}Use data attributes to easily control the position of the carousel. <code>data-slide</code> accepts the keywords <code>prev</code> or <code>next</code>, which alters the slide position relative to it's current position. Alternatively, use <code>data-slide-to</code> to pass a raw slide index to the carousel <code>data-slide-to="2"</code>, which jump's the slide position to a particular index beginning with <code>0</code>.{{/i}}</p>
<p>{{_i}}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>.{{/i}}</p>
<p>{{_i}}Options can be passed via data attributes or JavaScriptz. For data attributes, append the option name to <code>data-</code>, as in <code>data-interval=""</code>.{{/i}}</p>