웹표준,웹접근성(html, html5, css, css3, javascript, jQuery, jQueryMobile, snecha, senchaTouch, php, mobileWebApp)
jQ 레이어 띄우기 본문
<style>
#pop{ display:none; position:absolute; top:230px; left:110px; width:580px; height:305px; background:url(http://www.rice-museum.com/img/event/box_bg.gif)}
#bt{ position:absolute; top:932px; left:220px; z-index:500 }
#pop{ display:none; position:absolute; top:230px; left:110px; width:580px; height:305px; background:url(http://www.rice-museum.com/img/event/box_bg.gif)}
#boxXX{ position:relative; width:580px; text-align:right; top:0; right:0}
#boxBT{ position:absolute; top:240px; right:210px}
</style>
<script src="js/jquery-1.4.2.min.js"></script>
<script src="js/jquery-ui-1.8.2.custom.min.js"></script>
<script language="JavaScript" type="text/javascript">
$("#aaaa").bind("click",function(){
$("#pop").show(); // 클릭시 레이어 보여짐
$('html, body').animate({scrollTop:0}, 'slow'); // 클릭시 윈도우 스크롤 탑~ 최상위로
});
$("#bbbb").bind("click",function(){
$("#pop").hide();
});
});
</script>
<body>
<div id="pop">
<div id="boxXX"><img src="http://www.rice-museum.com/img/event/box_xxx.gif" id="bbbb" style="cursor:pointer;" /></div>
<div id="boxBT"><img src="http://www.rice-museum.com/img/event/box_bt.gif" id="btnSubmit" style="cursor:pointer;" /></div>
</div>
<div id="bt"><img src="http://www.rice-museum.com/img/event/bt.gif" id="aaaa" width="360" height="85" style="cursor:pointer;" /></div>
</body>
http://www.rice-museum.com/riceYoriKing/event_20111027.html
'jQuery' 카테고리의 다른 글
| jQ id값으로 폼검증하기 (0) | 2011.11.09 |
|---|---|
| jquery 셀렉터 (0) | 2011.11.09 |
| jquery 기본 필터 (0) | 2011.11.09 |