Я использую bootstrap для UI Design. Я настроил обновленный IntroJS на свой сайт. Теперь он отлично работает с другими элементами, но создает проблемы с элементами меню раскрывающегося меню.
Я использую bootstrap для UI Design. Я настроил обновленный IntroJS на свой сайт. Теперь он отлично работает с другими элементами, но создает проблемы с элементами меню раскрывающегося меню.
Эй, убедитесь, что ваша jquery-ссылка помещена сначала, а затем напишите ссылку javascript
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
Проверьте консоль. Скорее всего, jQuery не ссылался, и в этом случае вам нужно включить его перед IntroJS:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
Немного поздно для вечеринки, но для всех, кто ищет:
В раскрывающемся меню UL добавлен introjs-fixParent
, для меня это заставило мое меню появляться за другими элементами на странице, поэтому я исправил это, выполнив z-index: 1000!important
на UL. Intro.js добавляет introjs-showElement
к отображаемому элементу, который имеет действительно высокий z-индекс. Проблема здесь в том, что z-индекс родителей ниже маски, поэтому любые дети всегда находятся за маской.
Мое исправление заключалось в том, чтобы удалить z-index: 1000!important
в UL и поместить остальные элементы в мое меню.
У меня была такая же проблема, и мне удалось ее решить, я разместил там объяснение:
используйте intro.js в раскрывающемся элементе bootstrap
Надеюсь на эту помощь.
EDIT: добавлен фрагмент кода и объяснение из ссылки
Я нашел обходное решение, это довольно уродливо, но делает работу:
$scope.ChangeEvent = function (e) {
if (e.id === 'step2') {
document.getElementById('step1').click();
setTimeout(function () {
document.getElementById('step2').style.display = 'block';
}, 500);
}
console.log("Change Event called");
};
Я установил атрибут отображения для блокировки сразу после события клика, которое я добавил в событии изменения
При нажатии на щелчок элемента 1 я заметил, что jquery задал состояние style.display элемента 2 в '', поэтому я немного подождал, щелкнув, чтобы вернуть его в 'block', Я знаю это уродливо, но в то время я не нашел ничего лучшего