日韩VA中文字幕无码电影-亚洲一区二区三区橡胶防水-无码人妻一区二区三区兔费-香港三级日本三级A视频

SimpleModal是一個輕量級的jQuery插件，它為模態(tài)窗口的開發(fā)提供了一個強有力的接口，可以把它當作模態(tài)窗口的框架。simpleModal非常的靈活，可以創(chuàng)建你能夠想象到的東西。并且你還不需要考慮UI開發(fā)中跨瀏覽器相關問題。下面蘇州網(wǎng)站制作帶大家一起來了解下這個插件。

Eric Martin設計了simpleModal插件，并一直在進行改善和維護。

下載地址：http://www/.ericmmartin.com/projects/simplemodal/

simpleModal提供了兩種簡單方法來調(diào)用模態(tài)窗口。第一種方法是作為一個鏈式的jQuery函數(shù)。你可以在一個用jQuery獲取的元素上調(diào)用modal()函數(shù)，之后用這個元素的內(nèi)容來顯示一個模態(tài)窗口。比如：

<pre>$(“#element”).modal();</pre>

第二種方法是作為單獨的一個函數(shù)使用。通過傳遞一個jQuery對象，DOM元素或純文本（可以包含html）來創(chuàng)建一個模態(tài)窗口。比如：

<pre>$.modal(“<div><h1>simpleModal</h1></div>”)</pre>

以上兩種方法都可以接受一個可選參數(shù)，比如：

<pre>$(“#element”).modal({options});</pre>

<pre>$.modal(“<div><h1>simpleModal</h1></div>”,{options})</pre>

因為simplemodal不僅僅是一個模態(tài)窗口框架，以上的兩個例子只是創(chuàng)建非常基本的沒有樣式模態(tài)窗口。你也可以通過外部css，選項對象或兩個一起來應用樣式，modal overlay、container和data元素的css選項分別是：overlaycss、containercss和datacss，他們都是鍵值對（key/value）屬性。SimpleModal為顯示一個模態(tài)框窗口設置了必要的css，另外它動態(tài)地把模態(tài)窗口置于屏幕中間，除非預先使用了position參數(shù)。

SimpleModal在內(nèi)部定義了如下css類：simplemodal-overlay，simplemodal-container，simplemodal-wrap（如果內(nèi)容比container大，那么它將自動設置overflow為auto）和simplemodal-data。

SimpleModal的closeHTML參數(shù)默認聲明一個用于關閉模態(tài)窗口的圖片樣式：modalcloseImg，因為它被定義在參數(shù)里面，不能通過參數(shù)來應用樣式，所以一個外部css定義是必須的。

關閉模態(tài)窗口，simpleModal自動為模態(tài)窗口內(nèi)class是simplemodal-close的元素綁定了關閉函數(shù)。所以只要在html中添加如下代碼就可以關閉窗簾：

<pre><button type=’button’ class=’simplemodal-close’>關閉</button>或者<a href=’#’ class=’simplemodla-close’>關閉</a></pre>

此外，你也可以通過調(diào)用$.modal.close()的方式關閉當前打開的模態(tài)窗口。

如果你不想使用‘simplemodal-close’作為默認的關閉接口，而是想自己定義，那么你可以修改全局參數(shù)，代碼如下：

<pre>$.modal.defaults.closeClass=”modalClose”;</pre>

以上代碼將會會class為“modalCLose”綁定關閉函數(shù)。

如果要修改多個默認參數(shù)，可以使用如下代碼：

<pre>

$.extend($.modal.defaults,{

closeClass:”modalClose”,

closeHTML:”<a href=’#’>close</a>”

});