[javascript] 타이핑 스크롤 글상자
로빈아빠
본문
참고로 이건 아이프레임이 아니라 스크롤 상자예요...
여기서 줄 바꾸는 방법은 <br>이 아니라 \\n입니다.
우선 이 소스부터 넣으세요.
<script language="JavaScript">
function makeArray() {
this.length = makeArray.arguments.length
for (var i = 0; i < this.length; i++)
this[i+1] = makeArray.arguments[i]
}
var fArray = new makeArray;
fArray[0]="내용1";
fArray[1]="내용2"
fArray[2]="내용3"
fArray[3]="내용4"
fArray[4]="내용5"
fArray[5]="내용6"
var x = 1;
var y = 0;
var msg1 = fArray[y];
function newsFeed() {
if (x==msg1.length+1) {
for (var z=0; z < 40000; z++);
y+=1;
if (y > 5) y=0; //내용의 수 만큼
document.form1.news2.value=' ';
msg1 = fArray[y];
x=0;
}
document.form1.news2.value=msg1.substring(0,x);
x+=1;
setTimeout("newsFeed() ",150); //속도
}
</script>
<body onLoad="newsFeed();">
그 다음 아래 3개의 소스 중 하나를 선택해서 넣으세요.
첫 번재
<form name="form1">
<textarea wrap=physical rows=5 cols=35 name="news2">
</textarea>
두 번째
<STYLE type=text/css>
BODY
{
scrollbar-face-color: #FFFFFF;
scrollbar-shadow-color: #DEDEDE;
scrollbar-highlight-color: #DEDEDE;
scrollbar-3dlight-color: #ffffff;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-track-color: #ffffff;
scrollbar-arrow-color: #DEDEDE
}
</STYLE>
<form name="form1">
<textarea wrap=physical rows=5 cols="35" name="news2" style="padding:8; border-width:1; border-color:rgb(102,102,102); border-style:solid;">
</textarea></form>
세 번째(IE 5.5 이상)
<STYLE type=text/css>
BODY
{
scrollbar-face-color: #FFFFFF;
scrollbar-shadow-color: #DEDEDE;
scrollbar-highlight-color: #DEDEDE;
scrollbar-3dlight-color: #ffffff;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-track-color: #ffffff;
scrollbar-arrow-color: #DEDEDE
}
</STYLE>
<form name="form1">
<textarea wrap=physical rows=5 cols="35" name="news2" style="padding:8; border-color:rgb(102,102,102); border-style:dotted;">
</textarea></form>
rows : 한줄에 들어갈 최대 글자 수(스크롤 상자 너비)
cols : 보여질 최대 줄 수(스크롤 상자 높이)
<STYLE type=text/css>부터 </STYLE>까지는 스크롤바 색
padding : 스크롤 상자 내부 여백
border-color : 테두리 색
border-style : 테두리 종류
[이 게시물은 VIRHAC님에 의해 2009-09-13 14:40:37 HTML에서 이동 됨]
여기서 줄 바꾸는 방법은 <br>이 아니라 \\n입니다.
우선 이 소스부터 넣으세요.
<script language="JavaScript">
function makeArray() {
this.length = makeArray.arguments.length
for (var i = 0; i < this.length; i++)
this[i+1] = makeArray.arguments[i]
}
var fArray = new makeArray;
fArray[0]="내용1";
fArray[1]="내용2"
fArray[2]="내용3"
fArray[3]="내용4"
fArray[4]="내용5"
fArray[5]="내용6"
var x = 1;
var y = 0;
var msg1 = fArray[y];
function newsFeed() {
if (x==msg1.length+1) {
for (var z=0; z < 40000; z++);
y+=1;
if (y > 5) y=0; //내용의 수 만큼
document.form1.news2.value=' ';
msg1 = fArray[y];
x=0;
}
document.form1.news2.value=msg1.substring(0,x);
x+=1;
setTimeout("newsFeed() ",150); //속도
}
</script>
<body onLoad="newsFeed();">
그 다음 아래 3개의 소스 중 하나를 선택해서 넣으세요.
첫 번재
<form name="form1">
<textarea wrap=physical rows=5 cols=35 name="news2">
</textarea>
두 번째
<STYLE type=text/css>
BODY
{
scrollbar-face-color: #FFFFFF;
scrollbar-shadow-color: #DEDEDE;
scrollbar-highlight-color: #DEDEDE;
scrollbar-3dlight-color: #ffffff;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-track-color: #ffffff;
scrollbar-arrow-color: #DEDEDE
}
</STYLE>
<form name="form1">
<textarea wrap=physical rows=5 cols="35" name="news2" style="padding:8; border-width:1; border-color:rgb(102,102,102); border-style:solid;">
</textarea></form>
세 번째(IE 5.5 이상)
<STYLE type=text/css>
BODY
{
scrollbar-face-color: #FFFFFF;
scrollbar-shadow-color: #DEDEDE;
scrollbar-highlight-color: #DEDEDE;
scrollbar-3dlight-color: #ffffff;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-track-color: #ffffff;
scrollbar-arrow-color: #DEDEDE
}
</STYLE>
<form name="form1">
<textarea wrap=physical rows=5 cols="35" name="news2" style="padding:8; border-color:rgb(102,102,102); border-style:dotted;">
</textarea></form>
rows : 한줄에 들어갈 최대 글자 수(스크롤 상자 너비)
cols : 보여질 최대 줄 수(스크롤 상자 높이)
<STYLE type=text/css>부터 </STYLE>까지는 스크롤바 색
padding : 스크롤 상자 내부 여백
border-color : 테두리 색
border-style : 테두리 종류
[이 게시물은 VIRHAC님에 의해 2009-09-13 14:40:37 HTML에서 이동 됨]
관련링크
댓글목록
등록된 댓글이 없습니다.