如何使用jQuery在HTML中显示对话框？

Question

我想在我的网站上显示一个弹出对话框。

我想知道我还有什么办法可以做到这一点？

我知道对话框应该是一个具有固定或绝对位置的div的基础知识，最初是隐藏的，然后将其样式更改为阻止无，并且可能使用jQuery更改top属性和left div的动态大小。

所以问题是我应该手动编写Javascript还是应该使用像jQuery.ui这样的库来执行此操作？问题是jQuery.ui是200KB，这对于显示对话框来说太过分了。

除了jQuery.ui之外还有哪些替代方案？

Answer 1

听起来你仍然愿意使用jQuery UI。

使用jQuery UI。

如果您从jqueryui.com创建自定义构建，则实际的js文件将被29kb缩小，而不是您所担心的200kbish。 .dialog()听起来完全符合您的需求，29kb应该是可管理的，所以请不要编写代码：）

编辑：正如所建议的那样，AppRise以5kb的速度出现，这是一个很少和类似的功能。但是，jQuery UI还有一些带有大小开销的选项。

Answer 2

如果它非常简单，AppRise可能是一个不错的选择。

从他们的网站：

  

对于想要一个有吸引力的警报或对话框而不必下载大量UI框架的开发人员来说，或多或少都是。

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/

我希望这很有用