FrameSet Page Information<FRAMESET COLS="50%,*">
<FRAME
SRC="htmlform.htm"
NAME="choose">
<FRAME
SRC="sample.htm"
NAME="output">
</FRAMESET>
HTML tester page
Source Code
<SCRIPT>
function display(form) {
var format = form.toDisplay.value;
var doc = parent.output;
format = (form.big.checked)
? format.big()
: format;
format = (form.blink.checked)
? format.blink()
: format;
format = (form.bold.checked)
? format.bold()
: format;
format = (form.fixed.checked)
? format.fixed()
: format;
format = (form.italics.checked)
? format.italics()
: format;
format = (form.small.checked)
? format.small()
: format;
format = (form.strike.checked)
? format.strike()
: format;
format = (form.sub.checked)
? format.sub()
: format;
format = (form.sup.checked)
? format.sup()
: format;
format = (form.color.value == "") ?
format.fontcolor("black") :
format.fontcolor(form.color.value);
format = (form.size.value == "") ?
format.fontsize(3) :
format.fontsize(form.size.value);
var result = "<CENTER>The HTML code:
<XMP>";
result += format;
result += "</XMP> looks like:<P>"
result += format;
result += "</CENTER>";
doc.document.open("text/html");
doc.document.write(result);
doc.document.close();
}
</SCRIPT>
<BODY>
Please enter some text, select some attributes and enter a color and size (from 1 to
7).
The display will update dynamically.
<FORM>
<TEXTAREA
NAME="toDisplay" onChange="display(this.form);">
Enter Text Here
</TEXTAREA>
<INPUT
TYPE="checkbox"
NAME="big" onClick="display(this.form);">Big
<INPUT
TYPE="checkbox"
NAME="blink" onClick="display(this.form);">Blinking
<INPUT
TYPE="checkbox"
NAME="bold" onClick="display(this.form);">Bold
<INPUT
TYPE="checkbox"
NAME="small" onClick="display(this.form);">Small
<INPUT
TYPE="checkbox"
NAME="strike" onClick="display(this.form);">Striking
Out
<INPUT
TYPE="checkbox"
NAME="sub" onClick="display(this.form);">Subscript
<INPUT
TYPE="checkbox"
NAME="sup" onClick="display(this.form);">SuperScript
Font Color:
<INPUT
TYPE="text"
NAME="color"
VALUE="black" onChange="display(this.form);">
Font Size (1 to 7):
<INPUT
TYPE="text"
NAME="size"
VALUE="3" onChange="display(this.form);">
</FORM>
<SCRIPT>
display(document.forms[0]);
</SCRIPT> |