Как я могу отобразить диалог в HTML, используя jQuery?

Question

Я хотел отобразить всплывающее диалоговое окно на своем веб-сайте.

И я хотел бы знать, какие альтернативы у меня есть, чтобы сделать это?

Я знаю основы того, что диалоговое окно должно быть div, которое имеет фиксированную или абсолютную позицию и которое изначально скрыто, а затем его стиль изменяется на блокирование из none, и, возможно, свойство top и left изменяются сjQuery для отражения динамического размера div.

Итак, вопрос в том, должен ли я кодировать Javascript вручную или мне следует использовать какую-то библиотеку, например jQuery.ui, чтобы сделать это?Проблема в том, что jQuery.ui имеет размер 200 КБ, и это слишком много только для отображения диалога.

Какие есть альтернативы, кроме jQuery.ui?

Answer 1

Похоже, вы по-прежнему открыты для использования jQuery UI.

Используйте jQuery UI.

Если вы создаете пользовательскую сборку из jqueryui.com,фактический js-файл 29kb минимизирован, а не 200 Кбиш, которого вы боялись..dialog() звучит так, как будто он идеально соответствует вашим потребностям, и 29 КБ должны быть управляемыми, поэтому избавьте себя от написания кода:)

Редактировать: Как и предполагалось, AppRise входит в 5 КБ, что намного меньше ипохожий функционал.Однако в пользовательском интерфейсе jQuery есть еще несколько опций, связанных с размером.

Answer 2

Если бы это было что-то довольно простое, AppRise может быть хорошей альтернативой.

С их сайта:

Apprise, более или менее, предназначен для разработчика, который хочет получить привлекательное оповещение или диалоговое окно без необходимости загрузки массивной инфраструктуры пользовательского интерфейса.

Answer 3

после долгих поисков я нашел эту страницу, которая содержит много диалогов в jquery. http://choosedaily.com/1178/15-jquery-popup-modal-dialog-plugins-tutorials/

Теперь я действительно считаю jquery ui слишком раздутым для меня, и поэтому я попытаюсь использовать один из вариантов на странице выше.

Я думаю, что некоторые из них хорошо выглядят.

jqModal
http://dev.iceburg.net/jquery/jqModal/#examples

SimpleModal
http://www.ericmmartin.com/projects/simplemodal-demos/

и 2 ссылки ниже объясняют, как сделать это самостоятельно без какого-либо плагина:)

Встроенное модальное окно с CSS и jQuery
http://www.sohtanaka.com/web-design/inline-modal-window-w-css-and-jquery/

Как создать потрясающее и плавное всплывающее окно с помощью jQuery
http://yensdesign.com/2008/09/how-to-create-a-stunning-and-smooth-popup-using-jquery/

Надеюсь, это было полезно