일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- multipart
- TM128
- remote ip
- ajax 동기방식처리
- map api v3
- http https
- extundelete
- partition by
- mysql trigger
- 접속ip
- eclipse hotdeploy
- jquery selectbox change
- 첫주 및 마지막주 날짜 전체 포함
- update
- String 배열
- 폐업자에 대한 업종등의 정보내역
- KOSA
- group by max
- 2개 테이블
- ant path pattern
- 한국소프트웨어산업협회
- ajax async
- Oracle
- 서브쿼리
- 컴퓨터 드라이버
- mysql
- 주소 좌표변환
- String[]
- 아이폰키보드
- checkbox 값처리
- Today
- Total
하은양 믿음군 효실맘 호홍홍집s
버튼클릭시 해당버튼 근처에 레이어띄우기(offset 이용) 본문
$('#btnAddPP') 버튼을 클릭시, 버튼의 $(this).offset() 명령을 이용하여
현재 버튼의 Left (v_thisOffset.left), Top (v_thisOffset.top)을 구하고
그값을 통해 $('#mempplist') 레이어를 해당 버튼의 좌측에 표시하기
var v_btnAddPP = $('#btnAddPP');
v_btnAddPP.click(function(event){
var v_thisOffset = $(this).offset();
var v_mempplist = $('#mempplist');
var v_mempplistW = v_mempplist.width() + 20;
var v_mempplistH = v_mempplist.height() / 2;
v_mempplist.css({'left':v_thisOffset.left - v_mempplistW ,'top':v_thisOffset.top - v_mempplistH});
v_mempplist.show();
event.preventDefault();
});
레이어 div에는 position:absolute; 속성이 있어야하죵!!
<div id="mempplist" style="display: none;position:absolute;">
mempplist 레이어의 내용
</div>
// 해당 스크린 중앙에 위치시키기
var v_selRsvDate = $('[id^="selRsvDate_"]');
v_selRsvDate.click(function(event){
var v_thisOffset = $(this).offset();
var v_frmFileDiv = $('#frmFileDiv');
var v_frmFileDivW = v_frmFileDiv.width();
var v_frmFileDivH = v_frmFileDiv.height();
var midScreenX = Math.ceil(screen.width / 2);
var divL = midScreenX - Math.ceil(v_frmFileDivW / 2);
v_frmFileDiv.css({'left':divL ,'top':v_thisOffset.top + v_frmFileDivH});
v_frmFileDiv.show();
event.preventDefault();
});
'가벼운 배움 > JQuery' 카테고리의 다른 글
bxslider tab focus 처리하기... (0) | 2016.08.22 |
---|---|
callback함수이용하여 순차함수실행적용하기 (0) | 2016.07.25 |
본문글에 Highlight 처리하기 (0) | 2016.06.13 |
frameset 에서 src 접근하기 예제 (0) | 2016.06.13 |
네이버지도 샘플 (0) | 2016.06.02 |