2011-10-06 28 views
7

Quiero usar el efecto popover en un diálogo modals existente usando la biblioteca de CSS Bootstrap de Twitter. Ato el popover al ícono de imagen pequeña.Bootstrap: popover en modales

$('#infoIcon').popover({ 
    offset: 50, 
    placement: 'right' 
}); 

Los modales en sí también se añade, según la documentación:

$('#modalContainer').modal({ 
    keyboard : true 
}); 

Pero el efecto que tengo es, que el popover se hace bajo el contenedor modal vez lo largo de los div modal (véase el captura de pantalla a continuación). ¿Cómo puedo llevar el popover realmente SOBRE LA div modal?

enter image description here

Respuesta

1

tratar de comprobar cuál es el valor z-index de una ventana y modificar el índice z para el otro con un valor superior. Puede hacerlo con la función jQuery css si los complementos que está utilizando no permiten que esto cambie en sus parámetros de entrada.

5

En el mientras tanto se puede probar:

$('#infoIcon').popover({ 
    offset: 50, 
    placement: 'right' 
}); 

$("#infoIcon").data('popover').tip().css("z-index", 1060); 
5

que no es necesario Javascript para eso, basta con establecer el índice z de la popover a través de CSS:

.popover { 
    z-index: 1060; 
} 
2

si necesita trabajar en vuelo, debe usar

$("<style type='text/css'> .popover{z-index:1060;} </style>").appendTo("head"); 
Cuestiones relacionadas