JQuery弹出层空间——JqModal

郎增

2023-12-01

下面是从官方网站翻译的一点内容，也就是比较常用的几点，如果不正确的地方还望指正，如果想察看更详细的资料，察看后面的网址即可！

JqModal 是jQuery的一个插件，用来在web浏览器中显示自定义通告，对话框和模型窗口。它的灵活和小巧类似于一把瑞士军刀，而且它为通用窗口框架奠定了基础。

特征：

1，设计友好：使用HTML+CSS布局和设置样式

2，翻译者/i18n 友好—没有硬编码的字符串

3，开发者友好—通过调用方法进行扩展，使任何事变为可能

4，多模型支持

5，支持拖拽和重定义大小

6，支持远程加载窗口内容（ajax和iframes）

Current Version: 2008.06.22 +r12

Download the Plugin (jqModal.js - 3.01k) [jQuery >= 1.1.3.1+]
Download the Styling (jqModal.css - 496 bytes)

用法

通常情况下，如果你想在你的网站上添加弹出式对话框、框架、窗口或你拥有的任何可以添加的内容，你必须：

1，添加dialog placeholder(占位符)到你的网页

dialog placeholder(占位符)通常是隐藏的作为元素子元素的

容器。 CSS用来设计样式和位置。对话框在触发事件发生时显示 (“shown”).它的内容 (信息 /图片 /..)是内嵌在 html中的或者通过 ajax添加。

2，初始化对话框

每个对话框通过使用$.jqm()显示时都会调用JqModal 。你可以通过传递参数自定义你的对话框，例如：$('#dialog').jqm({modal: true, trigger: 'a.showDialog'});).

注意：$.jqm()只能被调用一次，在每个对话框使用时。尽管可以重复调用以修改参数。

3，触发对话框

当触发事件发生时，对话框会自动显示，你也可以通过执行$.jqmShow()方法来显示对话框

常用方法：

Jqm

初始化元素以使作为JqModal使用，接受传递的参数

$('#dialog').jqm();
$('.dialogs').jqm({ajax:'@href',modal:true});

JqmShow

显示jqModal元素

$('#dialog').jqmShow();
$('.dialogs').jqmShow();

jqmHide

隐藏jqModal元素

$('#dialog').jqmHide();
$('.dialogs').jqmHide();