add zindex option for tooltips/popovers and fix modal zindex doc example

This commit is contained in:
Jacob Thornton 2012-01-27 21:36:58 -08:00
parent 15d3a4797f
commit 0255f47eb3
4 changed files with 38 additions and 3 deletions

View File

@ -106,7 +106,14 @@ $(function () {
$('.tooltip-demo.well').tooltip({
selector: "a[rel=tooltip]"
})
$('.tooltip-test').tooltip()
$('.tooltip-test').tooltip({
'z-index': 3000
})
$('.popover-test').popover({
'z-index': 3000
})
// popover demo
$("a[rel=popover]")

View File

@ -221,7 +221,7 @@
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem.</p>
<h4>Popover in a modal</h4>
<p>This <a href="#" class="btn" rel="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.</p>
<p>This <a href="#" class="btn popover-test" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.</p>
<h4>Tooltips in a modal</h4>
<p><a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> should have tooltips on hover.</p>
@ -740,6 +740,12 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<p>Object structure is: <code>delay: { show: 500, hide: 100 }</code></p>
</td>
</tr>
<tr>
<td>z-index</td>
<td>number</td>
<td>1020</td>
<td>The tooltips z-index value</td>
</tr>
</tbody>
</table>
<p><span class="label notice">Notice</span> Individual tooltip instance options can alternatively be specified through the use of data attributes.</p>
@ -840,6 +846,12 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<p>Object structure is: <code>delay: { show: 500, hide: 100 }</code></p>
</td>
</tr>
<tr>
<td>z-index</td>
<td>number</td>
<td>1010</td>
<td>The popovers z-index value</td>
</tr>
</tbody>
</table>
<p><span class="label notice">Notice</span> Individual popover instance options can alternatively be specified through the use of data attributes.</p>

View File

@ -156,7 +156,7 @@
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem.</p>
<h4>{{_i}}Popover in a modal{{/i}}</h4>
<p>{{_i}}This <a href="#" class="btn" rel="popover" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.{{/i}}</p>
<p>{{_i}}This <a href="#" class="btn popover-test" title="A Title" data-content="And here's some amazing content. It's very engaging. right?">button</a> should trigger a popover on hover.{{/i}}</p>
<h4>{{_i}}Tooltips in a modal{{/i}}</h4>
<p>{{_i}}<a href="#" class="tooltip-test" title="Tooltip">This link</a> and <a href="#" class="tooltip-test" title="Tooltip">that link</a> should have tooltips on hover.{{/i}}</p>
@ -675,6 +675,12 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<p>{{_i}}Object structure is: <code>delay: { show: 500, hide: 100 }</code>{{/i}}</p>
</td>
</tr>
<tr>
<td>{{_i}}z-index{{/i}}</td>
<td>{{_i}}number{{/i}}</td>
<td>1020</td>
<td>The tooltips z-index value</td>
</tr>
</tbody>
</table>
<p>{{_i}}<span class="label notice">Notice</span> Individual tooltip instance options can alternatively be specified through the use of data attributes.{{/i}}</p>
@ -775,6 +781,12 @@ $('a[data-toggle="tab"]').on('shown', function (e) {
<p>{{_i}}Object structure is: <code>delay: { show: 500, hide: 100 }</code>{{/i}}</p>
</td>
</tr>
<tr>
<td>{{_i}}z-index{{/i}}</td>
<td>{{_i}}number{{/i}}</td>
<td>1010</td>
<td>The popovers z-index value</td>
</tr>
</tbody>
</table>
<p>{{_i}}<span class="label notice">Notice</span> Individual popover instance options can alternatively be specified through the use of data attributes.{{/i}}</p>

View File

@ -145,6 +145,9 @@
break
}
debugger
if (this.options['z-index']) tp['z-index'] = this.options['z-index']
$tip
.css(tp)
.addClass(placement)
@ -265,6 +268,7 @@
, trigger: 'hover'
, title: ''
, template: '<div class="tooltip"><div class="tooltip-arrow"></div><div class="tooltip-inner"></div></div>'
, 'z-index': false
}
}( window.jQuery )