The Filters Demo Tool: The Code
   |
The Filters Demo Tool
The Code
<HTML>
<HEAD>
<TITLE>Filters Demo Tool</TITLE>
<STYLE>
IMG {border:2px solid black}
BODY{
margin:0;
background:white;
font-family:verdana;
font-size:80%;
}
.bar{
background:#336699;
width:100%;
height:30px;
border-top:1px solid #99CCFF;
border-bottom:1px solid #000000;
font-size:15pt;
color:white;
padding-left:10px;
}
.desbar{
background:#FFFFFF;
width:100%;
padding: 10px;
border-top:1px solid #CCCCCC;
border-bottom:1px solid #000000;
color:black;
font-size:8pt;
}
SELECT { font-size:9pt; border:2px; }
</STYLE>
<SCRIPT LANGUAGE="javascript">
var startImage = "sunset.jpg";
function displayDefaultFilter() {
oImg.src=startImage;
changeFilter();
updateFilterCode();
}
function getVisibleObject(controlName) {
for (x=0; x < 2; x++) {
objTemp = document.all(controlName,x);
if (objTemp.parentElement.id == "oControlsSpan") {
return(objTemp);
}
}
}
function disableControlObject(controlName) {
for (x=0; x < 2; x++) {
document.all(controlName,x).disabled=true;
}
}
function enableControlObject(controlName) {
for (x=0; x < 2; x++) {
document.all(controlName,x).disabled=false;
}
}
function changeFilter() {
var selectObject = oSelect;
var selectedValue = selectObject.options[selectObject.selectedIndex].value;
imgObjText.innerHTML = "<BR>This filtered SPAN includes the football image, dark red text, and usually sky blue background.";
imgObj.style.backgroundColor='skyblue';
imgObj.style.color='darkred';
if (selectedValue != "empty") {
if (selectedValue.indexOf('Alpha')!=-1) {
oControlsSpan.innerHTML = oAlphaControls.innerHTML;
alphaFilterChange();
}
else if (selectedValue.indexOf('BasicImage')!=-1) {
oControlsSpan.innerHTML = oBasicImageControls.innerHTML;
basicImageFilterChange();
}
else if (selectedValue.indexOf('Chroma')!=-1) {
oControlsSpan.innerHTML = oChromaControls.innerHTML;
chromaFilterChange();
}
else if (selectedValue.indexOf('DropShadow')!=-1) {
imgObj.style.backgroundColor='';
oControlsSpan.innerHTML = oDropShadowControls.innerHTML;
dropShadowFilterChange();
}
else if (selectedValue.indexOf('Emboss')!=-1) {
oControlsSpan.innerHTML = "";
embossFilterChange();
}
else if (selectedValue.indexOf('Engrave')!=-1) {
oControlsSpan.innerHTML = "";
engraveFilterChange();
}
else if (selectedValue.indexOf('Glow')!=-1) {
oControlsSpan.innerHTML = oGlowControls.innerHTML;
glowFilterChange();
}
else if (selectedValue.indexOf('MotionBlur')!=-1) {
oControlsSpan.innerHTML = oMotionBlurControls.innerHTML;
motionBlurFilterChange();
}
else if (selectedValue.indexOf('Blur')!=-1) {
imgObj.style.backgroundColor='';
oControlsSpan.innerHTML = oBlurControls.innerHTML;
blurFilterChange();
}
else if (selectedValue.indexOf('Pixelate')!=-1) {
oControlsSpan.innerHTML = oPixelateFilterControls.innerHTML;
pixelateFilterChange();
}
else if (selectedValue.indexOf('Shadow')!=-1) {
oControlsSpan.innerHTML = oShadowFilterControls.innerHTML;
shadowFilterChange();
}
else if (selectedValue.indexOf('Wave')!=-1) {
oControlsSpan.innerHTML = oWaveFilterControls.innerHTML;
waveFilterChange();
}
else {
imgObj.style.filter=selectedValue;
oControlsSpan.innerHTML = '';
}
}
else {
alert("Errors in main menu");
}
updateFilterCode();
}
function updateFilterCode() {
oCodePre.innerText=imgObj.outerHTML;
}
function alphaFilterChange(){
var cmd;
var controlObject = getVisibleObject("styleList");
var style = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("opacityList");
var opacity = controlObject.options[controlObject.selectedIndex].value;
cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Alpha( " ;
cmd = cmd + "style=" + style + ",opacity=" + opacity ;
if (style!=0){
controlObject = getVisibleObject("finishOpacityList");
enableControlObject("finishOpacityList");
var finishOpacity = controlObject.options[controlObject.selectedIndex].value;
cmd = cmd + ",finishOpacity=" + finishOpacity ;
if (style==1){
controlObject = getVisibleObject("startXList");
enableControlObject("startXList");
var startX = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("finishXList");
enableControlObject("finishXList");
var finishX = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("startYList");
enableControlObject("startYList");
var startY = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("finishYList");
enableControlObject("finishYList");
var finishY = controlObject.options[controlObject.selectedIndex].value;
cmd = cmd + ",startX=" + startX + ",finishX=" + finishX ;
cmd = cmd + ",startY=" + startY + ",finishY=" + finishY;
}
else{
disableControlObject("startXList");
disableControlObject("finishXList");
disableControlObject("startYList");
disableControlObject("finishYList");
}
}
else{
disableControlObject("finishOpacityList");
disableControlObject("startXList");
disableControlObject("finishXList");
disableControlObject("startYList");
disableControlObject("finishYList");
}
cmd = cmd + ")'";
eval(cmd);
updateFilterCode();
}
function basicImageFilterChange(){
var cmd;
var controlObject = getVisibleObject("rotationList");
var rotation = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("mirrorSwitch");
controlObject.checked==true ? mirror = 1 : mirror = 0
controlObject = getVisibleObject("invertSwitch");
controlObject.checked==true ? invert = 1 : invert = 0
controlObject = getVisibleObject("xraySwitch");
controlObject.checked==true ? xray = 1 : xray = 0
controlObject = getVisibleObject("grayscaleSwitch");
controlObject.checked==true ? grayscale = 1 : grayscale = 0
controlObject = getVisibleObject("basicImageOpacityList");
var opacity = controlObject.options[controlObject.selectedIndex].value;
cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.BasicImage( Rotation="+ rotation +",Mirror=" + mirror + ",Invert=" + invert + ",XRay=" + xray + ",Grayscale=" + grayscale + ",Opacity=" + opacity;
cmd = cmd + ")'";
eval(cmd);
updateFilterCode();
}
function blurFilterChange(){
var controlObject = getVisibleObject("pixelRadiusList");
var pixelRadius = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("shadowOpacityList");
var shadowOpacity = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("makeShadowSwitch");
var makeShadow = controlObject.checked;
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Blur( PixelRadius="+ pixelRadius +"," + "MakeShadow=" + makeShadow + ",ShadowOpacity=" + shadowOpacity +")'";
eval(cmd);
updateFilterCode();
}
function chromaFilterChange(){
var controlObject = getVisibleObject("chromaColorList");
var chromaColor = controlObject.options[controlObject.selectedIndex].value;
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Chroma( Color="+ chromaColor +")'";
eval(cmd);
updateFilterCode();
}
function dropShadowFilterChange(){
var controlObject = getVisibleObject("shadowColorList");
var shadowColor = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("offsetXList");
var offX = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("offsetYList");
var offY = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("positiveSwitch");
var positive = controlObject.checked;
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.dropShadow( Color=" + shadowColor + ",offX=" + offX + ",offY=" + offY + ",positive=" + positive + ")'";
eval(cmd);
updateFilterCode();
}
function embossFilterChange(){
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Emboss()'";
eval(cmd);
updateFilterCode();
}
function engraveFilterChange(){
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Engrave( )'";
eval(cmd);
updateFilterCode();
}
function glowFilterChange(){
var controlObject = getVisibleObject("color");
var color = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("strength");
var strength = controlObject.options[controlObject.selectedIndex].value;
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Glow( Color="+ color +"," + "Strength=" + strength + ")'";
eval(cmd);
updateFilterCode();
}
function motionBlurFilterChange(){
var controlObject = getVisibleObject("Strength");
var strength = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("Direction");
var direction = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("addSwitch");
var add = controlObject.checked;
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.motionBlur( Strength=" + strength + ",Direction=" + direction + ",Add=" + add + ")'";
eval(cmd);
updateFilterCode();
}
function pixelateFilterChange(){
var controlObject = getVisibleObject("maxSquareFList");
var maxSquare = controlObject.options[controlObject.selectedIndex].value;
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Pixelate( maxsquare="+ maxSquare +")'";
eval(cmd);
updateFilterCode();
}
function shadowFilterChange(){
var controlObject = getVisibleObject("Color");
var color = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("Direction");
var direction = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("Strength");
var strength = controlObject.options[controlObject.selectedIndex].value;
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Shadow( Color=" + color + ",Direction=" + direction + ",Strength=" + strength + ")'";
eval(cmd);
updateFilterCode();
}
function waveFilterChange(){
var controlObject = getVisibleObject("LightStrength");
var lightStrength = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("Strength");
var strength = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("Phase");
var phase = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("Freq");
var freq = controlObject.options[controlObject.selectedIndex].value;
controlObject = getVisibleObject("addSwitch");
var add = controlObject.checked;
var cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Wave( LightStrength=" + lightStrength + ",Strength=" + strength + ",Phase=" + phase + ",Freq=" + freq + ",Add=" + add + ")'";
eval(cmd);
updateFilterCode();
}
</SCRIPT>
</HEAD>
<BODY BGCOLOR="#FFFFFF" onload="displayDefaultFilter()">
<!-- Title and Description -->
<DIV CLASS="bar" STYLE="POSITION:relative; TEXT-ALIGN: center; TOP:0; LEFT:0; Z-INDEX:10">Filters Demo Tool</DIV>
<DIV CLASS="desbar" STYLE="height:0">
<!-- Rendered content -->
<SPAN ID="oLiveSpan" style="POSITION: absolute; TOP: 45px; LEFT:310px; WIDTH: 400px; " >
<SPAN ID="imgObj" STYLE="WIDTH:405; HEIGHT:280; FONT:bold 9pt verdana; LINE-HEIGHT:1.3; PADDING-LEFT:13px; PADDING-RIGHT:20px"><IMG ID="oImg" ALIGN="left" STYLE="margin:8px;">
<DIV ID="imgObjText">
</DIV>
</SPAN>
</SPAN>
<!-- Control Panel -->
<SPAN ID="oControlPanel" STYLE="LEFT: 0px; POSITION: relative; TOP: -10; WIDTH: 300; HEIGHT: 350; PADDING-TOP: 5px; PADDING-RIGHT: 5px; PADDING-BOTTOM: 60px; PADDING-LEFT: 15px; Z-INDEX: 5; ">
<BR>
<SPAN id=filterSection>
Select a filter:
<SELECT ID=oSelect onchange=changeFilter()>
<OPTION value=progid:DXImageTransform.Microsoft.Alpha SELECTED>Alpha</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.BasicImage >BasicImage</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.Blur>Blur</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.Chroma>Chroma</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.DropShadow>DropShadow</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.Emboss >Emboss</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.Engrave>Engrave</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.Glow>Glow</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.MotionBlur>MotionBlur</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.Pixelate>Pixelate</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.Shadow>Shadow</OPTION>
<OPTION value=progid:DXImageTransform.Microsoft.Wave>Wave</OPTION>
</SELECT><hr></SPAN>
<SPAN ID="oControlsSpan">
</SPAN>
</SPAN>
</DIV>
<!-- Copy Code Bar -->
<SPAN BGCOLOR="#DDDDDD" CLASS="bar" STYLE="POSITION: relative; Z-INDEX:10; HEIGHT: 35px; LEFT: 0px; PADDING-LEFT: 5px; PADDING-RIGHT: 5px; TEXT-ALIGN: center; TOP: 0px; WIDTH: 100%;">Copy Code from Here and Paste in your Document
</SPAN>
<!-- Code -->
<SPAN ID=oCodeSpan style="position:relative; FONT-FAMILY: courier new; FONT-SIZE: 9pt; LINE-HEIGHT:1.5; LEFT: 0px; TOP: 0px; WIDTH: 100%; PADDING-TOP: 22px; PADDING-RIGHT: 5px; PADDING-BOTTOM: 22px; PADDING-LEFT: 5px; OVERFLOW: scroll; Z-INDEX: 4; HEIGHT:30%;">
<SPAN ID="oCodePre" STYLE=" HEIGHT: 100%; WIDTH: 95%">
</SPAN>
</SPAN>
<!--Alpha -->
<SPAN id=oAlphaControls style="DISPLAY: none"><BR/>
Style:
<SELECT onchange=alphaFilterChange() name=styleList id="styleList">
<OPTION value=0>0 - Uniform Opacity</OPTION>
<OPTION value=1 SELECTED>1 - Linear Opacity Change</OPTION>
<OPTION value=2>2 - Radial Opacity Change</OPTION>
<OPTION value=3>3 - Rectangular Opacity Change</OPTION>
</SELECT> <BR/><BR/>
Opacity:
<SELECT onchange=alphaFilterChange() name=opacityList>
<OPTION value=0>0</OPTION>
<OPTION value=25 SELECTED>25</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=75>75</OPTION>
<OPTION value=100>100</OPTION>
</SELECT>
FinishOpacity:
<SELECT onchange=alphaFilterChange() name=finishOpacityList>
<OPTION value=0>0</OPTION>
<OPTION value=25>25</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=75>75</OPTION>
<OPTION value=100 SELECTED>100</OPTION>
</SELECT> <BR/><BR/>
StartX:
<SELECT onchange=alphaFilterChange() name=startXList>
<OPTION value=0 SELECTED>0</OPTION>
<OPTION value=25>25</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=75>75</OPTION>
<OPTION value=100>100</OPTION>
</SELECT>
FinishX:
<SELECT onchange=alphaFilterChange() name=finishXList>
<OPTION value=0>0</OPTION>
<OPTION value=25>25</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=75>75</OPTION>
<OPTION value=100 SELECTED>100</OPTION>
</SELECT>
<BR/><BR/>
StartY:
<SELECT onchange=alphaFilterChange() name=startYList>
<OPTION value=0>0</OPTION>
<OPTION value=25>25</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=75>75</OPTION>
<OPTION value=100 SELECTED>100</OPTION>
</SELECT>
FinishY:
<SELECT onchange=alphaFilterChange() name=finishYList>
<OPTION value=0 SELECTED>0</OPTION>
<OPTION value=25>25</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=75>75</OPTION>
<OPTION value=100>100</OPTION>
</SELECT>
</SPAN>
<!--BasicImage -->
<SPAN id=oBasicImageControls style="DISPLAY: none"><BR/>
Rotation:
<SELECT onchange=basicImageFilterChange() name=rotationList>
<OPTION value=0 SELECTED>0 - 0 degrees</OPTION>
<OPTION value=1>1 - 90 degrees</OPTION>
<OPTION value=2>2 - 180 degrees</OPTION>
<OPTION value=3>3 - 270 degrees</OPTION>
</SELECT><BR/><BR/>
Opacity: <SELECT onchange=basicImageFilterChange() name=basicImageOpacityList>
<OPTION value=0.00>0.00</OPTION>
<OPTION value=0.25>0.25</OPTION>
<OPTION value=0.50>0.50</OPTION>
<OPTION value=0.75>0.75</OPTION>
<OPTION value=1.00 SELECTED>1.00</OPTION>
</SELECT><BR><BR/>
Mirror: <INPUT onclick=basicImageFilterChange() type=checkbox name=mirrorSwitch></INPUT>
Invert: <INPUT onclick=basicImageFilterChange() type=checkbox name=invertSwitch></INPUT><BR><BR/>
X-Ray: <INPUT onclick=basicImageFilterChange() type=checkbox name=xraySwitch></INPUT>
Grayscale: <INPUT onclick=basicImageFilterChange() type=checkbox name=grayscaleSwitch></INPUT>
</SPAN>
<!--Blur -->
<SPAN id=oBlurControls style="DISPLAY: none"><BR/>
PixelRadius:
<SELECT onchange=blurFilterChange() name=pixelRadiusList>
<OPTION value=0>0</OPTION>
<OPTION value=5 SELECTED>5</OPTION>
<OPTION value=10>10</OPTION>
<OPTION value=20>20</OPTION>
</SELECT> <BR/><BR/>
MakeShadow: <INPUT onclick=blurFilterChange() type=checkbox name=makeShadowSwitch>
</INPUT>
<BR><BR>ShadowOpacity:
<SELECT onchange=blurFilterChange() name=shadowOpacityList>
<OPTION value=0.00>0.00</OPTION> <OPTION value=0.25>0.25</OPTION>
<OPTION value=0.50>0.50</OPTION> <OPTION value=0.75>0.75</OPTION>
<OPTION value=1.00 SELECTED>1.00</OPTION>
</SELECT> <BR/><BR/>
</SPAN>
<!--Chroma-->
<SPAN id=oChromaControls style="DISPLAY: none"><BR/>
Color:
<SELECT onchange=chromaFilterChange() name=chromaColorList>
<OPTION value='#FFFFFF' SELECTED>White (FFFFFF)</OPTION>
<OPTION value='#87CEEB'>Sky blue (87CEEB)</OPTION>
<OPTION value='#8B0000'>Dark red(8B0000)</OPTION>
<OPTION value='#000000'>Black (000000)</OPTION>
</SELECT><BR/><BR/><BR/><BR/>
</SPAN>
<!-- DropShadow -->
<SPAN id=oDropShadowControls style="DISPLAY: none"><BR/>
Color:
<SELECT onchange=dropShadowFilterChange() name=shadowColorList>
<OPTION value=DDDDDD>Light Gray (DDDDDD)</OPTION>
<OPTION value=999999 SELECTED>Dark Gray (999999)</OPTION>
<OPTION value=000000>Black (000000)</OPTION>
<OPTION value=FFFF00>Yellow (FFFF00)</OPTION>
<OPTION value=0000FF>Blue (0000FF)</OPTION>
</SELECT>
<BR><BR>
OffX: <SELECT onchange=dropShadowFilterChange() name=OffsetXList>
<OPTION value=-5>-5</OPTION>
<OPTION value=-3>-3</OPTION>
<OPTION value=-1>-1</OPTION>
<OPTION value=1>1</OPTION>
<OPTION value=3>3</OPTION>
<OPTION value=5 SELECTED>5</OPTION>
</SELECT>
OffY: <SELECT onchange=dropShadowFilterChange() name=OffsetYList>
<OPTION value=-5>-5</OPTION>
<OPTION value=-3>-3</OPTION>
<OPTION value=-1>-1</OPTION>
<OPTION value=1>1</OPTION>
<OPTION value=3>3</OPTION>
<OPTION value=5 SELECTED>5</OPTION>
</SELECT><BR><BR>
Positive: <INPUT onclick=dropShadowFilterChange() type=checkbox CHECKED name=positiveSwitch></INPUT>
</SPAN>
<!--Emboss -->
<SPAN id=oEmbossControls style="DISPLAY: none">
</SPAN>
<!--Engrave -->
<SPAN id=oEngraveControls style="DISPLAY: none">
</SPAN>
<!-- Glow -->
<SPAN id=oGlowControls style="DISPLAY: none"><BR/>
Color:
<SELECT onchange=glowFilterChange() name=Color>
<OPTION value=DDDDDD>Light Gray (DDDDDD)</OPTION>
<OPTION value=999999 SELECTED>Dark Gray (999999)</OPTION>
<OPTION value=000000>Black (000000)</OPTION>
<OPTION value=FFFF00>Yellow (FFFF00)</OPTION>
<OPTION value=0000FF>Blue (0000FF)</OPTION>
</SELECT>
<BR><BR>
Strength: <SELECT onchange=glowFilterChange() name=Strength>
<OPTION value=1>1</OPTION>
<OPTION value=2>2</OPTION>
<OPTION value=3>3</OPTION>
<OPTION value=5>5</OPTION>
<OPTION value=10>10</OPTION>
<OPTION value=25 SELECTED>25</OPTION>
</SELECT><BR><BR><BR/><BR/>
</SPAN>
<!-- MotionBlur -->
<SPAN id=oMotionBlurControls style="DISPLAY: none"><BR/>
Strength: <SELECT onchange=motionBlurFilterChange() name=Strength>
<OPTION value=0>0</OPTION>
<OPTION value=5>5</OPTION>
<OPTION value=10 SELECTED>10</OPTION>
<OPTION value=20>20</OPTION>
<OPTION value=30>30</OPTION>
<OPTION value=50>50</OPTION>
</SELECT>
<BR><BR>
Direction: <SELECT onchange=motionBlurFilterChange() name=Direction>
<OPTION value=0 SELECTED>0</OPTION>
<OPTION value=45>45</OPTION>
<OPTION value=90>90</OPTION>
<OPTION value=135>135</OPTION>
<OPTION value=180>180</OPTION>
<OPTION value=225>225</OPTION>
<OPTION value=270>270</OPTION>
<OPTION value=315>315</OPTION>
</SELECT><BR/><BR/>
Add: <INPUT onclick=motionBlurFilterChange() type=checkbox name=addSwitch>
</INPUT><BR><BR><BR/><BR/>
</SPAN>
<!-- Pixelate -->
<SPAN id=oPixelateFilterControls style="DISPLAY: none"><BR/>
MaxSquare:
<SELECT onchange=pixelateFilterChange() name=maxSquareFList>
<OPTION value=2>2</OPTION>
<OPTION value=5>5</OPTION>
<OPTION value=10 SELECTED>10</OPTION>
<OPTION value=25>25</OPTION>
<OPTION value=50>50</OPTION>
</SELECT><BR/><BR/><BR/><BR/>
</SPAN>
<BR/><BR/><BR/><BR/>
<!-- Shadow -->
<SPAN id=oShadowFilterControls style="DISPLAY: none"><BR/>
Color:
<SELECT onchange=shadowFilterChange() name=Color>
<OPTION value=DDDDDD>Light Gray (DDDDDD)</OPTION>
<OPTION value=999999 SELECTED>Dark Gray (999999)</OPTION>
<OPTION value=000000>Black (000000)</OPTION>
<OPTION value=FFFF00>Yellow (FFFF00)</OPTION>
<OPTION value=0000FF>Blue (0000FF)</OPTION>
</SELECT>
<BR><BR>
Strength: <SELECT onchange=shadowFilterChange() name=Strength>
<OPTION value=2>2</OPTION>
<OPTION value=4>4</OPTION>
<OPTION value=8 SELECTED>8</OPTION>
<OPTION value=16>16</OPTION>
<OPTION value=32>32</OPTION>
<OPTION value=50>50</OPTION>
</SELECT><BR><BR>
Direction: <SELECT onchange=shadowFilterChange() name=Direction>
<OPTION value=0 SELECTED>0</OPTION>
<OPTION value=45>45</OPTION>
<OPTION value=90>90</OPTION>
<OPTION value=135>135</OPTION>
<OPTION value=180>180</OPTION>
<OPTION value=225>225</OPTION>
<OPTION value=270>270</OPTION>
<OPTION value=315>315</OPTION>
</SELECT><BR/><BR/><BR/><BR/>
</SPAN>
<!-- Wave -->
<SPAN id=oWaveFilterControls style="DISPLAY: none"><BR/>
LightStrength: <SELECT onchange=waveFilterChange() name=LightStrength>
<OPTION value=0 SELECTED>0</OPTION>
<OPTION value=10>10</OPTION>
<OPTION value=20>20</OPTION>
<OPTION value=30>30</OPTION>
<OPTION value=40>40</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=60>60</OPTION>
<OPTION value=70>70</OPTION>
<OPTION value=80>80</OPTION>
<OPTION value=90>90</OPTION>
<OPTION value=100>100</OPTION>
</SELECT>
Strength: <SELECT onchange=waveFilterChange() name=Strength>
<OPTION value=0>0</OPTION>
<OPTION value=2>2</OPTION>
<OPTION value=5 SELECTED>5</OPTION>
<OPTION value=10>10</OPTION>
<OPTION value=20>20</OPTION>
<OPTION value=30>30</OPTION>
</SELECT><BR><BR>
Phase: <SELECT onchange=waveFilterChange() name=Phase>
<OPTION value=0 SELECTED>0</OPTION>
<OPTION value=10>10</OPTION>
<OPTION value=20>20</OPTION>
<OPTION value=30>30</OPTION>
<OPTION value=40>40</OPTION>
<OPTION value=50>50</OPTION>
<OPTION value=60>60</OPTION>
<OPTION value=70>70</OPTION>
<OPTION value=80>80</OPTION>
<OPTION value=90>90</OPTION>
<OPTION value=100>100</OPTION>
</SELECT>
Freq: <SELECT onchange=waveFilterChange() name=Freq>
<OPTION value=1>1</OPTION>
<OPTION value=3>3</OPTION>
<OPTION value=5 SELECTED>5</OPTION>
<OPTION value=7>7</OPTION>
<OPTION value=9>9</OPTION>
<OPTION value=20>20</OPTION>
</SELECT>
Add: <INPUT onclick=waveFilterChange() type=checkbox name=addSwitch>
</INPUT>
<BR/><BR/><BR/><BR/>
</SPAN>
</BODY>
</HTML>
Next: A Final Word
Produced by Yehuda Shiran and Tomer Shiran
All Rights Reserved. Legal Notices.
Created: September 25, 2000
Revised: September 25, 2000
URL: https://www.webreference.com/js/column69/7.html
Find a programming school near you