Может любой говорить мне о библиотеке модального диалогового окна jQuery, которая не сосет
основанные на jQuery модальные диалоговые окна являются большими, пока Вы делаете столько, сколько пример говорит Вам. Мне нужна основанная на jQuery библиотека модального диалогового окна, которая должна иметь следующие характеристики:
Идеальная реализация:
function showDialog(values)
{
processToChangeDom(values);
changeDivTobeDisplayed();
modalDialog.show();
}
Это должно быть быстро, что-то как добавление и связывать диалоговое окно на StackOverflow. Большинство библиотек берет вечность для загрузки диалогового окна его необычными эффектами и материалом.
Я хочу назвать его с помощью сценария. Покажите скрытое отделение или встроенный элемент промежутка. Большая часть разговора библиотек, заполняющего привязку рэлом, классом и видом href =#hiddenDiv вещей. Я должен смочь к тому, что я хочу, не добавляя ненужные атрибуты к моей привязке. Что-то вроде этого
Это должно отразить изменения, которые я вношу в DOM в скрытом Отделении. Я использовал facebox и узнал, что он делает копию скрытого отделения, и изменения в DOM не размышляет над модальным окном.
Я должен смочь, называют близкое модальное отделение, использующее JavaScript, и также присоединяют beforeOpen и afterClose обработчики к действию.
У кого-либо есть какие-либо предложения? Я уже попробовал facebox, simplemodal и целый диапазон библиотек, большинство из них не поддерживает один или другие из этих функций, которые я описал выше.
7 ответов
Попробуйте SimpleModal. Я нашел его API довольно приятным.
Вы изучали jQuery UI? http://jqueryui.com/demos/dialog/
ThickBox работает очень хорошо, особенно если вы хотите делать такие вещи, как видео или мигать внутри модальных окон.
Попробуйте BlockUI . Я обнаружил, что это довольно хорошо.
jquery-ui dialog Я обнаружил, что он легкий и динамичный. Вот пример того, как вы можете использовать его в функции
function display_alert(message,title) {
title = title || "Alert";
$('#alert').text(message); // the message that will display in the dialog
$("#alert").dialog({
autoOpen: false,
bgiframe: true,
modal: true,
title:title,
open: function() {
},
close: function (){
$(document).unbind('keypress');
},
buttons: {
OK: function() {
$(this).dialog('close');
}
}
});
$('#alert').dialog('option', 'title', title);
$("#alert").dialog('open');
}
Я сам изучил довольно много модальных окон, и лучшее, что я придумал, это ThickBox. jquery UI box тоже был хорош, но мне не понравилось, как он обрабатывает кнопку "назад".
Thickbox покрывает пункты 1-3 в вашем списке требований. Обработчики четных нажатий могут быть легко добавлены, поскольку исходный код не слишком сложен.
Диалог пользовательского интерфейса jQuery делает почти все, что вы спрашиваю. Кроме того, я не заметил, что отображение занимает очень много времени. Вам даже не нужно иметь элемент DOM, чтобы использовать его. В виджетах пользовательского интерфейса хорошо то, что вам нужно загрузить только те компоненты, которые вам нужны, а также ядро. Они также широко доступны в сетях CDN, поэтому вполне возможно, что клиент пользователя уже загрузил для него JS.
$(function() {
$('<div title="I am a dialog"><p>Put whatever you want in here</p></div>')
.dialog({
autoOpen: true,
modal: true,
open: function(event,ui) { ... },
close: function(event,ui) {
...
$(this).dialog('destroy');
}
draggable: false,
resizable: false,
...
})
});