나모,태그프리 등의 ActiveX 컨트롤을 쓸때 간혹 그 위에 달력이 들어가는 경우가 있다...
그런데 이 달력이 ActiveX 밑으로 숨어버린다...
아이프레임을 이용하여 레이어를 올려봅시다.
달력은 많이들 쓰는 jQuery 달력입니다.
// 달력
$(document).ready(function() {
var dayNamesMin = ['일', '월', '화', '수', '목', '금', '토']
var monthNames = ['년 1월', '년 2월', '년 3월', '년 4월', '년 5월', '년 6월', '년 7월', '년 8월', '년 9월', '년 10월', '년 11월', '년 12월']
// 전체회원검색 - 가입일 달력
$('input[name=notice_start_date]').datepicker({
defaultDate: 'm',
dateFormat: 'yy-mm-dd',
dayNamesMin: dayNamesMin,
monthNames: monthNames,
prevText: '◀',
nextText: '▶',
showMonthAfterYear: true
});
$('input[name=notice_end_date]').datepicker({
defaultDate: 'm+30',
dateFormat: 'yy-mm-dd',
dayNamesMin: dayNamesMin,
monthNames: monthNames,
prevText: '◀',
nextText: '▶',
showMonthAfterYear: true
});
// 전체회원검색 - 가입일 달력
});
// 달력
?액티브엑스는 나모웹에디터 엑티브스퀘어를 대상으로 한 소스입니다.
시작일과 종료일을 입력받을 달력 2개
시작일과 종료일을 표현할 아이프레임 2개
<input type="text" name="notice_start_date" id="notice_start_date" value="<%=start_dt%>" readonly onclick="viewStart()" />
~
<input type="text" name="notice_end_date" id="notice_end_date" value="<%=end_dt%>" readonly onclick="viewEnd()" />
<div id="lblStart" style="display:none; width:240px; height:210px; position:absolute; left:290px; top:100px;"><iframe width="240px" height="210px" frameborder="0" src="about:blank"></iframe></div>
<div id="lblEnd" style="display:none; width:240px; height:210px; position:absolute; left:410px; top:100px;"><iframe width="240px" height="210px" frameborder="0" src="about:blank"></iframe></div>
<tr>
<th><span>내용</span></th>
<td height="200" valign="top" colspan="3">
<script language="javascript" src="/namo/NamoWec7.js"></script>
</td>
</tr>
//시작일 텍스트박스 클릭시 시작일 아이프레임을 보이게 합니다.
function viewStart() {
document.getElementById("lblStart").style.display = "block";
}
//종료일 텍스트박스 클릭시 종료일 아이프레임을 보이게 합니다.
function viewEnd() {
document.getElementById("lblEnd").style.display = "block";
}
//시작일,종료일 텍스트 박스 이외 다른 행동시 아이프레임을 안보이게 숨깁니다.
function OffLayer() {
selectobj = event.srcElement.id;
if (selectobj != "notice_start_date" && selectobj != "notice_end_date") {
document.getElementById("lblStart").style.display = "none"
document.getElementById("lblEnd").style.display = "none"
}
}
OffLayer() 함수는 html 렌더링이 모두 끝난 다음...즉 </html> 다음에 호출합니다.
</html>
<script type="text/javascript">
document.body.onclick = OffLayer;
</script>
'jQUERY' 카테고리의 다른 글
| 마우스 오른쪽 금지 (0) | 2016.07.13 |
|---|---|
| SNS Share (0) | 2015.12.06 |
| 비밀번호 공백 체크 (0) | 2015.09.03 |
| 시작페이지,즐겨찾기 (0) | 2015.05.28 |
| mobile browser check (0) | 2015.05.20 |