이 블로그 검색

2011년 3월 25일 금요일

클릭하는 위치에 팝업창띄우기

<script type="text/javascript">
function abspos(e){
    this.x = e.clientX + (document.documentElement.scrollLeft?document.documentElement.scrollLeft:document.body.scrollLeft);
    this.y = e.clientY + (document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop);
    return this;
}


function itemClick(e){
    var ex_obj = document.getElementById('lay');
    if(!e) e = window.Event;
    pos = abspos(e);
    ex_obj.style.left = pos.x+"px";
    ex_obj.style.top = (pos.y+10)+"px";
    ex_obj.style.display = ex_obj.style.display=='none'?'block':'none';
}
</script>



<div id="lay" style="position:absolute; display:none;">
내용레이어입니다.
</div>

<span onclick="itemClick(event);">클릭</span>
<a href="#" onclick="itemClick(event);">클릭</a>
<!--<input type="button" onclick="itemClick(event);" value="클릭">  -->

onclick 이벤트는 span, div, button에 사용하는 게 옮음.
a태그에서는 사용하지 않는 것이 좋음
a태그에 onclick를 하면 클릭후 화면 제일위로 이동됨

댓글 없음:

댓글 쓰기