Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
Tags
- utf-8
- javascript
- lsusb
- replace
- jQuery
- 시놀로지
- Injection
- euc-kr
- 무선랜카드
- RTL88x2BU
- 따라다니는 배너
- 커널
- SQL Injection
- Getrows
- submit
- println
- synology
- disabled
- FileSystemObject
- ASP
- ajax
- XMLHTTP
- 크로스 컴파일
- DS718+
- AC1300
- include
- readonly
- form
- PHP GCM
- jquery 레이어
Archives
- Today
- Total
아는 것이 좋은 것이다.
[jQuery] jQuery 레이어 팝업, 마우스 위치에 창 띄우기 본문
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <style type="text/css"> #divView { position:absolute; display:none; background-color:#ffffff; border:solid 2px #d0d0d0; width:350px; height:150px; padding:10px; } </style> <input type="button" class="imgSelect" serial="aa" idx="11" alt="버튼1" value="버튼1"/><!-- 임의로 serial, idx 삽입하여 스크립트로 값을 받게 할 수 있다. --> <input type="button" class="imgSelect" serial="bb" idx="22" alt="버튼2" value="버튼2"/> <input type="button" class="imgSelect" serial="cc" idx="33" alt="버튼3" value="버튼3"/> <div id="divView"></div> <script type="text/javascript"> //-- 버튼 클릭시 버튼을 클릭한 위치 근처에 레이어 생성 --// $('.imgSelect').click(function(e) { var divTop = e.clientY - 40; //상단 좌표 위치 안맞을시 e.pageY var divLeft = e.clientX; //좌측 좌표 위치 안맞을시 e.pageX var serial = $(this).attr("serial"); var idx = $(this).attr("idx"); $('#divView').empty().append('<div style="position:absolute;top:5px;right:5px"><span id="close" style="cursor:pointer;font-size:1.5em" title="닫기">X</span> </div><br><a href="?serial=' + serial + '">serial</a><BR><a href="?idx=' + idx + '">idx</a>'); $('#divView').css({ "top": divTop ,"left": divLeft , "position": "absolute" }).show(); $('#close').click(function(){document.getElementById('divView').style.display='none'}); }); </script>
'jQuery' 카테고리의 다른 글
[jQuery] 동적테이블 생성 삭제 계산 (0) | 2014.06.13 |
---|---|
[jQuery] radio 선택된 값 가져오기 (0) | 2014.06.12 |
[jQuery] 따라다니는 배너 (0) | 2014.05.30 |
[jQuery] 제이쿼리 갤러리 스크립트 모음 (0) | 2014.05.13 |
[jQuery] 하위메뉴 스크립트 (0) | 2014.05.12 |
Comments