셀렉트박스와 레이어가 겹칠시 레이어가 셀렉트 박스 뒤로 숨는 현상을 해결하는 함수
<script language='JavaScript'>
// Internet Explorer에서 셀렉트박스와 레이어가 겹칠시 레이어가 셀렉트 박스 뒤로 숨는 현상을 해결하는 함수
// 레이어가 셀렉트 박스를 침범하면 셀렉트 박스를 hidden 시킴
// 사용법 :
// <div id=LayerID style="display:none; position:absolute;" onpropertychange="selectbox_hidden('LayerID')">
function selectbox_hidden(layer_id)
{
var ly = eval(layer_id);
// 레이어 좌표
var ly_left = ly.offsetLeft;
var ly_top = ly.offsetTop;
var ly_right = ly.offsetLeft + ly.offsetWidth;
var ly_bottom = ly.offsetTop + ly.offsetHeight;
// 셀렉트박스의 좌표
var el;
for (i=0; i<document.forms.length; i++) {
for (k=0; k<document.forms[i].length; k++) {
el = document.forms[i].elements[k];
if (el.type == "select-one") {
var el_left = el_top = 0;
var obj = el;
if (obj.offsetParent) {
while (obj.offsetParent) {
el_left += obj.offsetLeft;
el_top += obj.offsetTop;
obj = obj.offsetParent;
}
}
el_left += el.clientLeft;
el_top += el.clientTop;
el_right = el_left + el.clientWidth;
el_bottom = el_top + el.clientHeight;
// 좌표를 따져 레이어가 셀렉트 박스를 침범했으면 셀렉트 박스를 hidden 시킴
if ( (el_left >= ly_left && el_top >= ly_top && el_left <= ly_right && el_top <= ly_bottom) ||
(el_right >= ly_left && el_right <= ly_right && el_top >= ly_top && el_top <= ly_bottom) ||
(el_left >= ly_left && el_bottom >= ly_top && el_right <= ly_right && el_bottom <= ly_bottom) ||
(el_left >= ly_left && el_left <= ly_right && el_bottom >= ly_top && el_bottom <= ly_bottom) )
el.style.visibility = 'hidden';
}
}
}
}
// 감추어진 셀렉트 박스를 모두 보이게 함
function selectbox_visible()
{
for (i=0; i<document.forms.length; i++) {
for (k=0; k<document.forms[i].length; k++) {
el = document.forms[i].elements[k];
if (el.type == "select-one" && el.style.visibility == 'hidden')
el.style.visibility = 'visible';
}
}
}
</script><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
// Internet Explorer에서 셀렉트박스와 레이어가 겹칠시 레이어가 셀렉트 박스 뒤로 숨는 현상을 해결하는 함수
// 레이어가 셀렉트 박스를 침범하면 셀렉트 박스를 hidden 시킴
// 사용법 :
// <div id=LayerID style="display:none; position:absolute;" onpropertychange="selectbox_hidden('LayerID')">
function selectbox_hidden(layer_id)
{
var ly = eval(layer_id);
// 레이어 좌표
var ly_left = ly.offsetLeft;
var ly_top = ly.offsetTop;
var ly_right = ly.offsetLeft + ly.offsetWidth;
var ly_bottom = ly.offsetTop + ly.offsetHeight;
// 셀렉트박스의 좌표
var el;
for (i=0; i<document.forms.length; i++) {
for (k=0; k<document.forms[i].length; k++) {
el = document.forms[i].elements[k];
if (el.type == "select-one") {
var el_left = el_top = 0;
var obj = el;
if (obj.offsetParent) {
while (obj.offsetParent) {
el_left += obj.offsetLeft;
el_top += obj.offsetTop;
obj = obj.offsetParent;
}
}
el_left += el.clientLeft;
el_top += el.clientTop;
el_right = el_left + el.clientWidth;
el_bottom = el_top + el.clientHeight;
// 좌표를 따져 레이어가 셀렉트 박스를 침범했으면 셀렉트 박스를 hidden 시킴
if ( (el_left >= ly_left && el_top >= ly_top && el_left <= ly_right && el_top <= ly_bottom) ||
(el_right >= ly_left && el_right <= ly_right && el_top >= ly_top && el_top <= ly_bottom) ||
(el_left >= ly_left && el_bottom >= ly_top && el_right <= ly_right && el_bottom <= ly_bottom) ||
(el_left >= ly_left && el_left <= ly_right && el_bottom >= ly_top && el_bottom <= ly_bottom) )
el.style.visibility = 'hidden';
}
}
}
}
// 감추어진 셀렉트 박스를 모두 보이게 함
function selectbox_visible()
{
for (i=0; i<document.forms.length; i++) {
for (k=0; k<document.forms[i].length; k++) {
el = document.forms[i].elements[k];
if (el.type == "select-one" && el.style.visibility == 'hidden')
el.style.visibility = 'visible';
}
}
}
</script><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]</div>
게시판 목록
팁게시판
디자인과 관련된 유용한 정보를 공유하세요.
질문은 상단의 QA에서 해주시기 바랍니다.
질문은 상단의 QA에서 해주시기 바랍니다.
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 5052 |
|
12년 전 | 2648 | |
| 5051 | 12년 전 | 2972 | ||
| 5050 |
hwang007
|
12년 전 | 946 | |
| 5049 | 12년 전 | 4694 | ||
| 5048 | 12년 전 | 1243 | ||
| 5047 |
basaria
|
12년 전 | 20243 | |
| 5046 |
|
12년 전 | 3442 | |
| 5045 |
|
12년 전 | 2195 | |
| 5044 |
|
12년 전 | 4863 | |
| 5043 | 12년 전 | 3839 | ||
| 5042 | 12년 전 | 1029 | ||
| 5041 | 12년 전 | 3757 | ||
| 5040 | 12년 전 | 1761 | ||
| 5039 | 12년 전 | 935 | ||
| 5038 | 12년 전 | 2152 | ||
| 5037 | 12년 전 | 7899 | ||
| 5036 | 12년 전 | 1917 | ||
| 5035 | 12년 전 | 1532 | ||
| 5034 | 12년 전 | 2121 | ||
| 5033 | 12년 전 | 1844 | ||
| 5032 | 12년 전 | 903 | ||
| 5031 | 12년 전 | 1023 | ||
| 5030 | 12년 전 | 5948 | ||
| 5029 | 12년 전 | 1229 | ||
| 5028 | 12년 전 | 3391 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기