jQuery 애니메이션 팝업 양식은 다양한 프레젠테이션 방법을 지원합니다_jquery

애니메이션 효과
어떤 개체에서 시작되는지, 즉 개체에서 시작하여 점차 화면 중앙으로 이동하고 점차 확대되면 내부 개체가 천천히 표시됩니다. 위에서 아래로 확장합니다. 클릭하여 닫을 때는 먼저 확장된 표시된 개체를 천천히 축소한 다음 트리거된 개체로 천천히 이동합니다.
좀 복잡해서 무슨 뜻인지도 모르겠어요. 직설적으로 말하면 지금 있는 곳에서 왔다 갔다 한다는 뜻이에요.
표시 방법
첫 번째 방법: 문자열
가장 간단하고 명확한 방법은 말할 것도 없이 문자열 값을 직접 할당하여 표시하는 것입니다.
두 번째 유형: ajax
비동기적으로 데이터를 얻어서 표시하는 ajax를 지원하는 디스플레이입니다.
　세 번째 유형: iframe
　이름에서 알 수 있듯이 중첩된 iframe 표시를 지원합니다.
　네 번째 유형: 컨트롤
　이 이름은 약간 이해하기 어렵습니다. 페이지에 개체를 표시하는 것입니다. 예: document.getElementById("showName");
플러그인 코드 구현

코드 복사 코드는 다음과 같습니다. 다음은:

(function($){
$.alerts = {
alert : function(o,options){
var defaults = {
title : '标题',
content : '内容',
GetType : 'string', //controls,ajax,string,iframe
IsDrag : true,
Url : '',
Data : null,
width:400,
height:300,
callback : function(){}
}
var options = $.extend(defaults,options);
if(!$("#window")[0])
{
$.alerts._createObject();
}
var position = $.alerts._getPosition(o);
var winPosition = $.alerts._getWindowPosition(options);
$("#windowContent").hide();
$("#window").css(
{
width:position.w,
height:position.h,
top:position.t,
left:position.l,
zIndex:1001
}
);
$("#windowBottom,#windowBottomContent").css(
{
height:options.height-30
}
);
$("#windowContent").css(
{
height:options.height - 45,
width:options.width - 25
}
);
$("#windowTopContent").html(options.title);
switch(options.GetType){
case "string":
$("#windowContent").html(options.content);
break;
case "ajax":
if(options.Url == ''){
alert("AjaxUrl不能为空");
return;
}else{
$.ajax(
{
type: "POST",
url: options.Url,
data: options.Data,
success: function(msg){
$("#windowContent").html(msg);
}
}
);
}
break;
case "controls":
$("#windowContent").html(options.content.innerHTML);
break;
case "iframe":
$("#windowContent").empty();
$("