<style type="text/css">
#latest_pop{position:fixed;right:10px;bottom:0px;}
#latest_pop .latest_wrap{position:relative;display:block;padding:0px;}
#latest_pop .latest_wrap .latest_bg{position:absolute;z-index:1;width:100%;height:100%;}
#latest_pop .latest_wrap ul{position:relative;display:block;list-style:none;z-index:2;padding: 0px ;margin:0px;}
#latest_pop .latest_wrap ul li{position:relative;display:block;bottom:-100px;padding:5px;margin:10px 0px;height:20px;line-height:20px;z-index:2;transition: 0.8s; -webkit-transition: 0.8s;background-color:#333;opacity:0.95;color:#fff;border:1px solid #000;}
#latest_pop .latest_wrap ul li.in{bottom:0px;}
</style>
<script type="text/javascript">
<!--
var latest_pop = function(){
var e = {
url:'http://gnu5.tongkn.co.kr/json.latest.php',
bo_table:"notice",
data:null,
time :<?=date("YmdHis")?>,
tmr :null
}
var setData = function(){
var wrap = $("#latest_pop");
var box = wrap.find("ul");
var elm = null;
$.each(e.data, function( i, v ) {
elm = box.append( "<li>" );
box = wrap.find("ul");
elm = box.find("li:last");
elm.text( v.wr_name + "님의 글이 등록되었습니다. (" + v.wr_time + ")" );
elm.animate({bottom: "0px"}, 500);
e.time = v.time;
var _tmr = setTimeout(function(){ elm.fadeOut(function(){ $(this).remove(); }) }, 20000);
});
}
var getAjax = function(){
$.ajax({
dataType:"jsonp",
jsonp:"callback",
url:e.url,
data:{bo_table:e.bo_table,time:e.time},
success:function(callback){e.data=callback;},
complete:function(d){setData();},
error:function(d){msg("error "+d.responseText);}
});
}
e.tmr = setInterval(function(){ getAjax(); }, 5000);
}
$(function(){
latest_pop();
});
//-->
</script>
<div id='latest_pop' >
<div class='latest_wrap'>
<div class='latest_bg'></div>
<ul></ul>
</div>
</div>
