0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-29 11:24:18 +01:00

fix z-index issue with modals for popovers,tooltips,and dropdowns

This commit is contained in:
Jacob Thornton 2012-01-28 12:08:41 -08:00
parent c2c02d104c
commit 12d3c2fe74
7 changed files with 29 additions and 38 deletions

View File

@ -2238,6 +2238,18 @@ table .span12 {
.pager .previous a {
float: left;
}
.modal-open .dropdown-menu {
z-index: 2050;
}
.modal-open .dropdown.open {
*z-index: 2050;
}
.modal-open .popover {
z-index: 2060;
}
.modal-open .tooltip {
z-index: 2070;
}
.modal-backdrop {
position: fixed;
top: 0;

View File

@ -69,13 +69,8 @@
selector: "a[rel=tooltip]"
})
$('.tooltip-test').tooltip({
'z-index': 3000
})
$('.popover-test').popover({
'z-index': 3000
})
$('.tooltip-test').tooltip()
$('.popover-test').popover()
// popover demo
$("a[rel=popover]")

View File

@ -748,12 +748,6 @@ $('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>
<div class="alert alert-info">
@ -860,12 +854,6 @@ $('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>
<div class="alert alert-info">

View File

@ -683,12 +683,6 @@ $('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>
<div class="alert alert-info">
@ -795,12 +789,6 @@ $('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>
<div class="alert alert-info">

View File

@ -44,6 +44,8 @@
if (this.isShown) return
$('body').addClass('modal-open')
this.isShown = true
this.$element.trigger('show')
@ -77,6 +79,8 @@
var that = this
this.isShown = false
$('body').removeClass('modal-open')
escape.call(this)
this.$element

View File

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

View File

@ -1,6 +1,13 @@
// MODALS
// ------
.modal-open {
.dropdown-menu { z-index: @zindexDropdown + @zindexModal }
.dropdown.open { *z-index: @zindexDropdown + @zindexModal }
.popover { z-index: @zindexPopover + @zindexModal }
.tooltip { z-index: @zindexTooltip + @zindexModal }
}
.modal-backdrop {
position: fixed;
top: 0;