링크
http://php.chol.com/~sung21ce/kimssam/util/round.html (1912) http://php.chol.com/~sung21ce/kimssam/round.php (1689)
어디선가 낚시했다가 필요할것 같아 보관해 놓은 것인데 .
아마 모질라는 잘 모르겠습니다. ^^
링크 #1은 원본을 그대로 이용한 것이고
링크 #2는 최신글에 적용 시켜 보았습니다.
<HTML>
<HEAD>
<TITLE> 모서리 라운드테이블 </TITLE>
</HEAD>
<script>
function roundTable(objID) {
var obj = document.getElementById(objID);
var Parent, objTmp, Table, TBody, TR, TD;
var bdcolor, bgcolor, Space;
var trIDX, tdIDX, MAX;
var styleWidth, styleHeight;
// get parent node
Parent = obj.parentNode;
objTmp = document.createElement('SPAN');
Parent.insertBefore(objTmp, obj);
Parent.removeChild(obj);
// get attribute
bdcolor = obj.getAttribute('rborder');
bgcolor = obj.getAttribute('rbgcolor');
radius = parseInt(obj.getAttribute('radius'));
if (radius == null || radius < 1) radius = 1;
else if (radius > 6) radius = 6;
MAX = radius * 2 + 1;
/*
create table {{
*/
Table = document.createElement('TABLE');
TBody = document.createElement('TBODY');
Table.cellSpacing = 0;
Table.cellPadding = 0;
for (trIDX=0; trIDX < MAX; trIDX++) {
TR = document.createElement('TR');
TD = document.createElement('TD');
styleWidth = '1px'; styleHeight = '1px';
if (tdIDX == 0 || tdIDX == MAX - 1) styleHeight = null;
else if (trIDX == 0 || trIDX == MAX - 1) styleWidth = null;
else if (radius > 2) {
if (Math.abs(tdIDX - radius) == 1) styleWidth = '2px';
if (Math.abs(trIDX - radius) == 1) styleHeight = '2px';
}
if (styleWidth != null) TD.style.width = styleWidth;
if (styleHeight != null) TD.style.height = styleHeight;
if (Space == tdIDX || Space == MAX - tdIDX - 1) TD.style.backgroundColor = bdcolor;
else if (tdIDX > Space && Space < MAX - tdIDX - 1) TD.style.backgroundColor = bgcolor;
if (Space == 0 && tdIDX == radius) TD.appendChild(obj);
TR.appendChild(TD);
}
TBody.appendChild(TR);
}
/*
}}
*/
Table.appendChild(TBody);
// insert table and remove original table
Parent.insertBefore(Table, objTmp);
}
</script>
<BODY>
<table id="ta" width="300" height="150" border="0" radius="3" rborder="#999999" rbgcolor="#F8F8F8">
<tr>
<td valign="top">테스트입니다</td>
</tr>
</table>
<script>roundTable("ta");</script>
</BODY>
</HTML><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:54:41 CSS에서 이동 됨]</div>
아마 모질라는 잘 모르겠습니다. ^^
링크 #1은 원본을 그대로 이용한 것이고
링크 #2는 최신글에 적용 시켜 보았습니다.
<HTML>
<HEAD>
<TITLE> 모서리 라운드테이블 </TITLE>
</HEAD>
<script>
function roundTable(objID) {
var obj = document.getElementById(objID);
var Parent, objTmp, Table, TBody, TR, TD;
var bdcolor, bgcolor, Space;
var trIDX, tdIDX, MAX;
var styleWidth, styleHeight;
// get parent node
Parent = obj.parentNode;
objTmp = document.createElement('SPAN');
Parent.insertBefore(objTmp, obj);
Parent.removeChild(obj);
// get attribute
bdcolor = obj.getAttribute('rborder');
bgcolor = obj.getAttribute('rbgcolor');
radius = parseInt(obj.getAttribute('radius'));
if (radius == null || radius < 1) radius = 1;
else if (radius > 6) radius = 6;
MAX = radius * 2 + 1;
/*
create table {{
*/
Table = document.createElement('TABLE');
TBody = document.createElement('TBODY');
Table.cellSpacing = 0;
Table.cellPadding = 0;
for (trIDX=0; trIDX < MAX; trIDX++) {
TR = document.createElement('TR');
TD = document.createElement('TD');
styleWidth = '1px'; styleHeight = '1px';
if (tdIDX == 0 || tdIDX == MAX - 1) styleHeight = null;
else if (trIDX == 0 || trIDX == MAX - 1) styleWidth = null;
else if (radius > 2) {
if (Math.abs(tdIDX - radius) == 1) styleWidth = '2px';
if (Math.abs(trIDX - radius) == 1) styleHeight = '2px';
}
if (styleWidth != null) TD.style.width = styleWidth;
if (styleHeight != null) TD.style.height = styleHeight;
if (Space == tdIDX || Space == MAX - tdIDX - 1) TD.style.backgroundColor = bdcolor;
else if (tdIDX > Space && Space < MAX - tdIDX - 1) TD.style.backgroundColor = bgcolor;
if (Space == 0 && tdIDX == radius) TD.appendChild(obj);
TR.appendChild(TD);
}
TBody.appendChild(TR);
}
/*
}}
*/
Table.appendChild(TBody);
// insert table and remove original table
Parent.insertBefore(Table, objTmp);
}
</script>
<BODY>
<table id="ta" width="300" height="150" border="0" radius="3" rborder="#999999" rbgcolor="#F8F8F8">
<tr>
<td valign="top">테스트입니다</td>
</tr>
</table>
<script>roundTable("ta");</script>
</BODY>
</HTML><div class='small'>[이 게시물은 관리자님에 의해 2011-10-31 16:54:41 CSS에서 이동 됨]</div>
게시글 목록
| 번호 | 제목 |
|---|---|
| 978 | |
| 973 |
Flash
wmode
4
|
| 966 |
Flash
플래시 flv(동영상) 사용경험담
4
|
| 960 | |
| 958 |
기타
Top으로 ver2
|
| 956 |
JavaScript
제목에 첫 글자만 스타일적용과 문장의 첫라인 스타일 적용
1
|
| 953 | |
| 941 | |
| 938 | |
| 937 |
Flash
창크기 자동 조절
|
| 936 |
Flash
플래시 메뉴
|
| 929 | |
| 923 |
JavaScript
메모하지 않으면 깜빡깜빡 잊어버리는 것들
3
|
| 922 |
기타
빈 무비클립 만들기
|
| 919 | |
| 918 | |
| 914 |
JavaScript
euc-kr 문서를 utf-8 로 변환
3
|
| 911 | |
| 908 | |
| 907 |
기타
Ajax 흉내 내기
|
| 904 |
JavaScript
포토샵에서 트랜스폼과 카피를 동시에 하는 방법
2
|
| 899 | |
| 896 |
JavaScript
mod_rewrite 설치 법
2
|
| 895 | |
| 892 |
JavaScript
포토샵의 블렌딩 모드
2
|
| 888 |
JavaScript
opacity(투명도) 값 쉽게 먹이기.
3
|
| 882 | |
| 877 |
기타
서버정보검색
1
|
| 873 |
기타
텍스트시계
3
|
| 869 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기