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?", { title: "Confirm Dialog Box", animateIn : "bounceInDown", animateOut: "bounceOutUp" }); }); </script>
위는 편집기에서 소개한 jQuery 기반의 애니메이션 효과가 포함된 멋진 팝업 대화 상자입니다(소스 코드 다운로드 포함). 모두에게 도움이 되기를 바랍니다!