셀렉트박스와 레이어가 겹칠시 레이어가 셀렉트 박스 뒤로 숨는 현상을 해결하는 함수
<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에서 해주시기 바랍니다.
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 177 | 20년 전 | 1961 | ||
| 176 | 20년 전 | 1787 | ||
| 175 | 20년 전 | 1866 | ||
| 174 | 20년 전 | 1682 | ||
| 173 | 20년 전 | 2054 | ||
| 172 | 20년 전 | 1770 | ||
| 171 | 20년 전 | 2546 | ||
| 170 | 20년 전 | 2248 | ||
| 169 | 20년 전 | 2538 | ||
| 168 | 20년 전 | 1469 | ||
| 167 | 20년 전 | 1577 | ||
| 166 | 20년 전 | 2144 | ||
| 165 | 20년 전 | 1610 | ||
| 164 | 20년 전 | 3736 | ||
| 163 | 20년 전 | 2655 | ||
| 162 | 20년 전 | 2082 | ||
| 161 | 20년 전 | 2770 | ||
| 160 | 20년 전 | 1719 | ||
| 159 | 20년 전 | 1600 | ||
| 158 | 20년 전 | 2553 | ||
| 157 | 20년 전 | 1459 | ||
| 156 | 20년 전 | 1703 | ||
| 155 | 20년 전 | 3205 | ||
| 154 | 20년 전 | 1863 | ||
| 153 | 20년 전 | 1585 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기