jQuery를 기반으로 한 애니메이션 효과로 멋진 팝업 대화 상자 구현(소스 코드 다운로드 포함)_jquery

jQuery를 기반으로 한 팝업 대화 플러그인입니다. 이 jQuery 대화 상자 플러그인의 가장 큰 특징은 팝업과 닫기 모두 회전, 날아오기, 위로 날아가기 등 매우 멋진 애니메이션 효과를 가지고 있다는 것입니다. 아래로 흔들리고 날아가는 것 등등. 렌더링은 다음과 같습니다.

효과 시연  소스코드 다운로드

html 코드:

<div class="container">
<h1>jQuery gDialog Plugin Exampels</h1>
<button class="btn demo-1">Alert Dialog Box</button>
<button class="btn demo-2">Prompt Dialog Box</button>
<button class="btn demo-3">Prompt Dialog Box</button>
</div>
<script src="src/jquery.js"></script>
<script src="src/jquery.gDialog.js"></script>
<script>
$('.demo-1').click(function(){
$.gDialog.alert("Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse libero erat, scelerisque sit amet dolor nec, euismod feugiat massa.", {
title: "Alert Dialog Box",
animateIn: "bounceIn",
animateOut: "bounceOut"
});
}); 
$('.demo-2').click(function(){
$.gDialog.prompt("脚本之家", <a href="http://www.jb51.net">www.jb51.net</a>, {
title: "Prompt Dialog Box",
required: true,
animateIn : "rollIn",
animateOut: "rollOut"
});
}); 
$('.demo-3').click(function(){
$.gDialog.confirm("Are You Sure&#63;", {
title: "Confirm Dialog Box",
animateIn : "bounceInDown",
animateOut: "bounceOutUp"
});
}); 
</script>

위는 편집기에서 소개한 jQuery 기반의 애니메이션 효과가 포함된 멋진 팝업 대화 상자입니다(소스 코드 다운로드 포함). 모두에게 도움이 되기를 바랍니다!