팝업창 쉽게 적용 하기 > 그누4 팁자료실

그누4 팁자료실

그누보드4와 관련된 팁을 여러분들과 함께 공유하세요.
나누면 즐거움이 커집니다.

팝업창 쉽게 적용 하기 정보

팝업창 쉽게 적용 하기

본문

팝업 링크에대해 보다 쉽게 처리 하기 위해 만들어 봣습니다.
제이쿼리 사용했습니다.

<ul class="popup">
<li><a href="http://naver.com" class="s-1024-100">네이버팝업</a></li>
<li><a href="http://daum.net" class="s-200-200">다음팝업</a></li>
<li><a href="http://nate.com" class="s-300-300">네이트팝업</a></li>
<li><a href="http://google.com" class="s-400-400">구글팝업</a></li>

</ul>
<script type="text/javascript">
//<![CDATA[
$(function() {
$('ul.popup a').click(function() {
var href = this.href, $this = $(this);
var cls = $this.attr('class');
var flag;

var re = /s-[\d]+-[\d]+/;
var arr = re.exec(cls);
if(arr) {
arr = arr[0].split('-');
flag = "width=" + arr[1] +",";  //창크기 a 태그에 class에 s-넓이-높이  준다 ex)class="s-500-500"
flag += "height=" + arr[2] + "";
window.open(href, 'popup', flag);
return false;
}
});
});
//]]>
</script>

추가로 옵션 넣으시면 됩니다.
width 팝업창 가로길이
height 팝업창 세로길이
toolbar=no 단축도구창(툴바) 표시안함
menubar=no 메뉴창(메뉴바) 표시안함
location=no 주소창 표시안함
scrollbars=no 스크롤바 표시안함
status=no 아래 상태바창 표시안함
resizable=no 창변형 하지않음
fullscreen=no 전체화면 하지않음
channelmode=yes 앞 또는 뒤로,창최소화. 닫기등을 설정한다. / F11번 키랑 같다
left=0 왼쪽에 창을 고정시킨다.
top=0 위쪽에 창을 고정시킨다.
추천
1

댓글 6개

전체 1 |RSS
그누4 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1402호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT