JavaScript DHTML/Development/Color

Материал из Web эксперт
Перейти к: навигация, поиск

Code for the Actual JavaScript Code and Color Selectors

   <source lang="html4strict">

<html> <head>

 <title>Color Definition</title>
 <SCRIPT LANGUAGE="JavaScript">
 
 </script>

</head>

<body bgcolor="tomato">

 <form name="form1">

Select Color: <select name="colorList" size="1"> <option>black</option> <option>blue</option> <option>brown</option> <option>cyan</option> <option>gold</option> <option>gray</option> <option>green</option> <option>indigo</option> <option>lavender</option> <option>lime</option> <option>maroon</option> <option>navy</option> <option>olive</option> <option>orange</option> <option>pink</option> <option>purple</option> <option>red</option> <option>royalblue</option> <option>silver</option> <option>slategray</option> <option>tan</option> <option>teal</option> <option>turquoise</option> <option>violet</option> <option>white</option> <option>yellow</option> </select>
<input type="radio" name="type" value="bgColor" checked>Background</input> <input type="radio" name="type" value="fgColor">Foreground</input> <input type="radio" name="type" value="alinkColor">Activated Link</input> <input type="radio" name="type" value="linkColor">Unvisted Link</input> <input type="radio" name="type" value="vlinkColor">Visited Link</input>
<input type="button" name="Apply" value="Apply" onclick="refreshMain()">

 </form>

</body> </html>

      </source>
   
  


Color Sampler

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Color Me</TITLE> <SCRIPT LANGUAGE="JavaScript"> var newWindow = window.open("","","height=150,width=300") function defaultColors() {

   return "BGCOLOR="#c0c0c0" VLINK="#551a8b" LINK="#0000ff""

} function uglyColors() {

   return "BGCOLOR="yellow" VLINK="green" LINK="red""

} function showColorValues() {

   var result = ""
   result += "bgColor: " + newWindow.document.bgColor + "\n"
   result += "vlinkColor: " + newWindow.document.vlinkColor + "\n"
   result += "linkColor: " + newWindow.document.linkColor + "\n"
   document.forms[0].results.value = result

} function drawPage(colorStyle) {

   var thePage = ""
   thePage += "<HTML><HEAD><TITLE>Color Sampler</TITLE></HEAD><BODY "
   if (colorStyle == "default") {
       thePage += defaultColors()
   } else {
       thePage += uglyColors()
   }
   thePage += ">Just so you can see the variety of items and color, <A "
   thePage += "HREF="http://www.wbex.ru">here\"s a link</A>"
   newWindow.document.write(thePage)
   newWindow.document.close()
   showColorValues()

} function setColors(colorStyle) {

   if (colorStyle == "default") {
       document.bgColor = "#c0c0c0"
   } else {
       document.bgColor = "yellow"
   }

} </SCRIPT> </HEAD> <BODY> Try the two color schemes on the document in the small window. <FORM> <INPUT TYPE="button" NAME="default" VALUE="Default Colors" onClick="drawPage("default")">

<INPUT TYPE="button" NAME="weird" VALUE="Ugly Colors" onClick="drawPage("ugly")">

<TEXTAREA NAME="results" ROWS=3 COLS=20></TEXTAREA><P>


These buttons change the current document, but not correctly on all platforms<P> <INPUT TYPE="button" NAME="default" VALUE="Default Colors" onClick="setColors("default")"> <INPUT TYPE="button" NAME="weird" VALUE="Ugly Colors" onClick="setColors("ugly")"><P> </FORM> <SCRIPT LANGUAGE="JavaScript"> drawPage("default") </SCRIPT> </BODY> </HTML>


      </source>
   
  


Using Color Attributes: how document colors can be changed

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Changing Colors</TITLE> <SCRIPT LANGUAGE="JavaScript"></SCRIPT> </HEAD> <BODY>

Changing Colors

<P>Here is a <A HREF="nowhere">sample link</A>.

<SCRIPT LANGUAGE="JavaScript"></SCRIPT> </BODY> </HTML>

      </source>
   
  


Using Colors in JavaScript

   <source lang="html4strict">

<html> <head>

 <title>JavaScript Unleashed</title>

</head> <body>

<script type="text/javascript"> </script>

<script type="text/javascript"> </script>

</body>

</html>


      </source>
   
  


Using setInterval () to Repeatedly Change the Document Background Color

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>Using setInterval()</TITLE> <SCRIPT LANGUAGE="JavaScript1.2"></SCRIPT> </HEAD> <BODY BGCOLOR="white">

The setInterval() repeatedly changes the document background color every three seconds.

</BODY> </HTML>

      </source>