<%@page import="java.util.ArrayList"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%request.setCharacterEncoding("utf-8");%>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
<script src="../../js/jquery.bpopup.min.js"></script>
<style type="text/css">body { position: relative; }
.popup-div { opacity: 0; display: none; position: relative; width: auto; }
.popup-style { border: 5px solid #06f; padding: 20px; background-color: #fff; }
.b-close { position: absolute; right: 5px; top: 5px; padding: 5px; display: inline-block; cursor: pointer; }
.button { padding: 5px 10px; border: 1px solid #666; display: inline-block; cursor: pointer; }
</style>
<body>
<span class="button" id="btn1">slideDown 기본스타일 팝업</span>
<div id="popup1" class="popup-div popup-style">
<span class="b-close"><span>X</span></span>
<div class="content" style="height: auto; width: auto;">
<div class="b-ajax-wrapper">
<div>
<h2>popup1</h2>
<p>팝업 1 <a href="http://..../bpopup/" target="_blank">http://..../bpopup</a></p>
<p>기본팝업 테스트</p>
</div>
</div>
</div>
</div>
<script type="text/javascript">$(document).ready(function() {
$('#btn1').on('click', function(event) {
event.preventDefault();
$('#popup1').bPopup();
});
});
</script>
</body>