Bootstrap: поповер на модалы

Question

Я хочу использовать эффект поповер в существующем модальном диалоговом окне, используя Bootstrap CSS Library из Twitter. Я привязываю поповер к маленькому значку изображения.

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

Также добавляются сами модалы в соответствии с документацией:

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

Но эффект, который я получил, заключается в том, что всплывающее окно отображается под модальным контейнером, а не над модальным div (см. Скриншот ниже). Как я могу по-настоящему перенести поповер на модальный div?

Answer 1

Ребята из Bootstrap определили эту проблему как ошибку и исправили ее в следующем выпуске. подробности см. Здесь

Answer 2

Для этого вам не нужен javascript, просто установите z-индекс поповера через CSS:

.popover {
    z-index: 1060;
}

Answer 3

Тем временем вы можете попробовать:

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

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

Answer 4

если вам нужно работать на лету, вы должны использовать

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

Answer 5

Попробуйте проверить, каково значение z-index одного окна, и измените z-index для другого с более высоким значением. Это можно сделать с помощью функции jQuery css , если используемые плагины не допускают этого изменения своих входных параметров.