read : JS로 라운드 DIV만들기 : 기술 #javascript::공대여자홈

JS로 라운드 DIV만들기

목록

작성자 mins

링크 작성 : 2006-12-04 12:10 조회 : 115
지남 1일간

2006-12-04 - 2006-12-04

좌표
첨부된 파일이 없습니다.

#javascript

function css_round_div(this_s)
{
	//====================
	// div_root를 this_s 앞에 위치시킨다.(붙이는거지)
	//====================	
	var div_root = document.createElement('div'); // 외각 div
	if (this_s.nextSibling) 
	this_s.parentNode.insertBefore(div_root,this_s.nextSibling);
	else this_s.parentNode.appendChild(div_root);
	//====================
	// 특수 스타일 초기화
	//====================	
	div_root.style.margin=this_s.style.margin;
	if(this_s.width){div_root.style.width = this_s.width;}
	else{	div_root.style.width=this_s.style.width;	}
	this_s.style.margin = '0px';
	this_s.style.width = 'auto';	
	//====================
	// 라운드용 div 만들기
	//====================		
	var div_content = document.createElement('div'); // 내용을 감싸는 부분
		div_content.style.backgroundColor=this_s.style.backgroundColor;	
		div_content.style.borderStyle=this_s.style.borderStyle;
		div_content.style.borderColor=this_s.style.borderColor;
		div_content.style.borderWidth="0px 1px 0px 1px";				
		div_content.appendChild(this_s);			
	var div_s1 = document.createElement('div'); //  라운드 1
		div_s1.style.backgroundColor=this_s.style.backgroundColor;
		div_s1.style.overflow ='hidden';
		div_s1.style.lineHieght="1px";
		div_s1.style.marginRight=div_s1.style.marginLeft="4px";
		div_s1.style.display="block";
		if(this_s.style.borderTopStyle){
			div_s1.style.borderTopColor=this_s.style.borderTopColor;
			div_s1.style.borderWidth="1px 0px 0px 0px";
			div_s1.style.borderStyle=this_s.style.borderStyle;
			div_s1.style.height="0px";			
		}
	var div_s2 = div_s1.cloneNode(true); //  라운드 2
		div_s2.style.height="1px";				
		div_s2.style.backgroundColor=this_s.style.backgroundColor;	
		div_s2.style.marginRight=div_s2.style.marginLeft="3px";
		if(this_s.style.borderStyle){
			div_s2.style.borderStyle=this_s.style.borderTopStyle;
		}		
		div_s2.style.borderColor=this_s.style.borderColor;
		div_s2.style.borderWidth="0px 1px 0px 1px";		
	
	var div_s3 = div_s2.cloneNode(true); //  라운드 3
		div_s3.style.marginRight=div_s3.style.marginLeft="2px";
	var div_s4 = div_s3.cloneNode(true); //  라운드 4		
		div_s4.style.height="2px";	
		div_s4.style.marginRight=div_s4.style.marginLeft="1px";
	var div_s5 = div_s4.cloneNode(true); //  라운드 4
	var div_s6 = div_s3.cloneNode(true); //  라운드 4
	var div_s7 = div_s2.cloneNode(true); //  라운드 4
	var div_s8 = div_s1.cloneNode(true); //  라운드 4

this_s.style.borderStyle='none';
	div_root.appendChild(div_s1);
	div_root.appendChild(div_s2);
	div_root.appendChild(div_s3);
	div_root.appendChild(div_s4);		
	div_root.appendChild(div_content);
	div_root.appendChild(div_s5);
	div_root.appendChild(div_s6);
	div_root.appendChild(div_s7);
	div_root.appendChild(div_s8);		
	//====================
	// "공대여자는 이쁘다"를 나타내야만 쓸 수 잇습니다.
	//====================		
}

"공대여자는 이쁘다."를 나타내야만 쓸 수 있습니다.

"공대여자는 이쁘다."를 나타내야만 쓸 수 있습니다.

목록

댓글

/ /
No Nickname

No Comment
권한이 없습니다.

{{m_row.m_nick}}

내용이 너무 많습니다!

-

목록형 📅 달력형

No	제목	작성자	등록	조회
공지	[기본형] HTML (with 부트스트랩5.3 , jquery 3.7, vue.js)	공대여자	02/06 13:44	1865
공지	유용한 리눅스(LINUX) 명령어	공대여자	03/03 14:47	11514
공지	[공지] 기술 게시판	mins01	06/24 15:10	11719

주요 프로세스 목록이 있는 사이트

#link

js_layer_colorpicker.js : 컬러픽커,색상선택 레이어

#javascript

for IE CSS Hack

#css

js_layer_calendar 날짜 선택 달력 스크립트 (동적,DOM)

#javascript

httpd.conf SSL설정

#linux

JS로 만든 이미지없이 라운딩(table)

#javascript

PHPSCHOOL Lotto 체커 (숫자 4 버전) 수정버전

#etc

mysql 기본명령어

#dbms #mysql

입력 글자바이트 제한 textarea,textbox용

#javascript

JS로 라운드 DIV만들기

#javascript

JS로 만들어진 레이어팝업,alert,comfirm

#link

input text용 updown 버튼

#javascript

라디오 타입에서 선택된 값 가져오기 get_radio_value()

#javascript

돈숫자에 ',' 붙이기 money_point(str)

#javascript

아파치에서 SSL 설정하는 방법

#link