demo示例:  file:///C:/Users/gzk12/Desktop/jqueryPlugPop/index.html

    彈框有多種css樣式和動畫效果, 可以修改彈框提示層文字,按鈕等. 可以新增彈框圖片, 並且在彈框顯示前

後都有回撥函式.

// 官網示例: 做一次搬運工

$.Pop()介紹

Pop是基於JQ編寫的一個彈出層外掛，其中使用了大量CSS3效果，內建了CSS樣式無需再呼叫CSS樣式，當然您也可以使用自己的CSS樣式，擴充套件能力極強！

Pop預設的2個彈窗引數，分別是alert，confirm，均可回撥。

$.Pop('你好，歡迎使用Pop外掛','alert',function(){alert('點選確定的回撥')})

$.Pop('你好，歡迎使用Pop外掛,點選確定返回回撥','confirm',function(){alert('點選確定的回撥')})

預設9個動畫,可惜的是需要CSS3的支援。如果不支援CSS3將沒有動畫效果。只需要配置Animation屬性即可，動畫程式碼在彈出層中

        $.Pop('slideFromTop效果',{Animation:'slideFromTop'})

可以使用多個按鈕，最多可以使用8個,每個按鈕都可以繫結不同的事件。
vla配置按鈕名稱，class按鈕樣式，ope按鈕事件

$.Pop('按鈕效果',{
Btn:{
yes:{vla:"",class:"",ope:function(){},},
no:{vla:"",class:"",ope:function(){},},
cancel:{vla:"",class:"",ope:function(){},},
bnt1:{vla:"",class:"",ope:function(){},},
bnt2:{vla:"",class:"",ope:function(){},},
bnt3:{vla:"",class:"",ope:function(){},},
bnt4:{vla:"",class:"",ope:function(){},},
bnt5:{vla:"",class:"",ope:function(){},},
}
})

更多的配置選項

$.Pop('按鈕',{
Title:"來自Pop外掛的通知",//標題
Close:true,//是否顯示關閉按鈕 true(開)/false(關)
Animation:"layerFadeIn",// 預設動畫
BoxBg:true, // 是否顯示遮罩背景層 true(開)/false(關)
BoxDrag:true, // 是否可以移動彈出層 true(開)/false(關)
BoxBgopacity:0.6, // 遮罩層的透明度 0-1 0完全透明1完全黑暗
ZIndex:99999, // 彈出層的cssz-index屬性
Class:false, // 是否疊加css樣式
Btn:{}// 按鈕
});

   

下面是預設的CSS，只為看出區別所以隨便寫的，每行必須以!important強制使用為結尾。

.yushe{ background-color: #555!important; color:#fff!important; }
.yushe .box-title{ color:#fff!important; }

$.Pro()介紹

Pro是一個自動提醒的小外掛，非常小巧，常常用於驗證反饋使用

$.Pro('演示效果')

引數配置：
$.Pro('演示效果',{
Img:false,// 是否新增一個圖片 ，新增格式，Img："img/a.jpg"
ImgWh:"150*150",// 圖片大小 格式,寬*高，預設100*100點選我檢視原因
BoxBgopacity:0.8,//背景色的透明度 0為完全透明1為完全不透明
ZIndex:99999//css的z-index屬性
Time:3,// 延遲關閉的時間
StartOn:false,// 外掛開始時執行的事件，格式StartOn:function(){**你要執行的程式碼**}
EndOn:false,// 外掛結束時執行的事件，格式StartOn:function(){**你要執行的程式碼**}
Class:false,// 疊加的CSS樣式，用法與Pop樣式疊加一直檢視PopCSS樣式疊加
});