jQuery ui диалоговое окно и наш самый дорогой друг, ie6
Я использую jQuery ui диалоговое окно для модального всплывающего диалогового окна. Это работает отлично в Firefox/Chrome, но ужасное в ie6.
Проблема: Когда я показываю диалоговое окно в ie6, окно браузера выращивает и автоматически прокручивает вниз к нижней части. Увеличение высоты и автоматический прокручивающийся вниз равно высоте диалогового окна jQuery.
Я могу прокрутить и затем использовать диалоговое окно в качестве нормального, но поведение, где это выращивает окно и отбрасывания, невыносимо недопустимо.
Вот то, как я запускаю окно:
<div id="dialogWindow"></div>
...
$(document).ready(function() {
var $dialog = $("#dialogWindow").dialog({
autoOpen: false,
modal: true,
minWidth: 560,
width: 560,
resizable: "true",
position: "top"
});
$('.addButton').click(function(e) {
e.preventDefault();
$('#dialogWindow').load('http://myurl');
$dialog.dialog('open');
});
});
Я уже использую bgiframe плагин для jQuery, который является ключевым для проблем наложения ie6. Но это кажется не связанным с этим. Кто-либо видел это прежде и нашел работу вокруг?
2 ответа
Я видел такое поведение раньше, и обычно оно вызвано наложением. Когда вы используете параметр {modal: true}, создается и отображается наложение с поддержкой bgiframe , если подключаемый модуль загружен.
Во-первых, попробуйте включить {modal: false} и посмотрите, не происходит ли выдутие страницы, тогда мы знаем, что это наложение.
есть несколько вещей, которые нужно проверить, не является ли это виновником;
- убедитесь, что стили для оверлея загружаются правильно, вам необходимо включить jquery-ui dialog.css
- попробуйте поэкспериментировать с положением : и float: styles
- попробуйте переместить разметку диалогового окна чуть выше тега , чтобы модальное наложение было корректно экранировано.
Однажды у меня была похожая проблема.
$('.addButton').click(function(e) {
e.preventDefault();
$('#dialogWindow').load('http://myurl');
var y = window.pageYOffset;
var x = window.pageXOffset
$dialog.dialog('open');
window.scrollTo(x, y); // horizontal and vertical scroll targets
});
Вышеупомянутое должно получить текущие координаты прокрутки и сохранить их. Когда откроется диалоговое окно, вы вернетесь к предыдущей позиции в памяти. Должен быть почти мгновенным и невидимым для пользователя.