|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<script language="javascript">
function displayText(){
var objresult = document.getElementById("display");
var objtext = document.getElementById("toString");
var objcolor = document.getElementById("colorSelect");
var objsize = document.getElementById("sizeSelect");
var objoption = document.getElementsByName("type"); //복수 s **, name으로 값 가져옴
target = target.fontcolor(objcolor.options[objcolor.selectedIndex].value);
target = target.fontsize(objsize.options[objsize.selectedIndex].value);
if(objoption[0].checked){
target = target.strike();
}if(objoption[1].checked){
target = target.big();
}if(objoption[2].checked){
target = target.small();
}if(objoption[3].checked){
target = target.bold();
}if(objoption[4].checked){
target = target.italics();
}if(objoption[5].checked){
target = target.sub();
}if(objoption[6].checked){
target = target.sub();
}if(objoption[7].checked){
target = target.toLowerCase();
}if(objoption[8].checked){
target = target.toUpperCase();
}
objresult.innerHTML = target;
}
</script>
</HEAD>
<BODY>
<center>
<br><br><br>
<input type="text" size="30" id = "toString">
<button name = "pre" onClick="displayText()">미리보기</button><br><br>
색상
<select id= "colorSelect">
<option value="red">빨강</option>
<option value="green">초록</option>
<option value="blue">파랑</option>
<option value="black">검정</option>
</select>
크기 :
<select id= "sizeSelect">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="4">5</option>
<option value="4">6</option>
</select><br><br>
<input type="checkbox" name="type"/> 취소선
<input type="checkbox" name="type"/> 크게
<input type="checkbox" name="type"/> 작게
<input type="checkbox" name="type"/> 두껍게
<input type="checkbox" name="type"/> 기울임
<br>
<input type="checkbox" name="type"/> 위첨자
<input type="checkbox" name="type"/> 아래첨자
<input type="checkbox" name="type"/> 소문자
<input type="checkbox" name="type"/> 대문자
<br><br>
<span id = "display" ></span>
<center>
</BODY>
</HTML>
http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4f; text-decoration:none">Colored by Color Scripter
|
'HTML & CSS & JAVASCRIPT' 카테고리의 다른 글
| 예제_회원가입 (0) | 2019.06.20 |
|---|---|
| 예제_push,pop (0) | 2019.06.20 |
| 예제_계산기 (0) | 2019.06.20 |
| JAVASCRIPT 예제_prompt, confirm (0) | 2019.06.20 |
| JAVASCRIPT 예제_오른쪽마우스 막기, 스크롤 금지 (0) | 2019.06.20 |