JavaScript DHTML/HTML/HR Line

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

Controlling HR Object Properties (IE)

   <source lang="html4strict">

<HTML> <HEAD> <TITLE>HR Object Properties</TITLE> <SCRIPT LANGUAGE="JavaScript"> function setHRAttr(select) { 

   if (document.all && document.all.myHR) {
       var choice = select.options[select.selectedIndex].value
       if (choice) {
           document.all.myHR.setAttribute(select.name, choice)
       }
   }

} </SCRIPT> </HEAD> <BODY>

HR Object Properties


Here is the HR element you will be controlling:

<FORM> Select an alignment: <SELECT NAME="align" onChange="setHRAttr(this)"> 

   <OPTION></OPTION>
   <OPTION VALUE="left">Left</OPTION>
   <OPTION VALUE="center">Center</OPTION>
   <OPTION VALUE="right">Right</OPTION>

</SELECT>
Select a rule color (IE only): <SELECT NAME="color" onChange="setHRAttr(this)"> 

   <OPTION></OPTION>
   <OPTION VALUE="red">Red</OPTION>
   <OPTION VALUE="green">Green</OPTION>
   <OPTION VALUE="blue">Blue</OPTION>
   <OPTION VALUE="#FA8072">Some Hex Triplet Value</OPTION>

</SELECT>
Select a rule shading: <SELECT NAME="noShade" onChange="setHRAttr(this)"> 

   <OPTION></OPTION>
   <OPTION VALUE=true>No Shading</OPTION>
   <OPTION VALUE=false>Shading</OPTION>

</SELECT>
Select a rule height: <SELECT NAME="size" onChange="setHRAttr(this)"> 

   <OPTION></OPTION>
   <OPTION VALUE=2>2 (Default)</OPTION>
   <OPTION VALUE=4>4 Pixels</OPTION>
   <OPTION VALUE=10>10 Pixels</OPTION>

</SELECT>
Select a rule width: <SELECT NAME="width" onChange="setHRAttr(this)"> 

   <OPTION></OPTION>
   <OPTION VALUE="100%">100% (Default)</OPTION>
   <OPTION VALUE="80%">80%</OPTION>
   <OPTION VALUE=300>300 Pixels </OPTION>

</SELECT> </BODY> </HTML> 


      </source>


Draw line with parameter

   <source lang="html4strict">

<html> <head> <script language="JavaScript">

</script> </head> <body>

JavaScript Essentials <script>hr("75%","4")</script>

</body> </html> 

      </source>


HR size

   <source lang="html4strict">

<html> <body> <script language="JavaScript"> function function1() { 

   document.getElementById("myHR").size = "30";

} </script>

<input type="button" value="Size=30" onClick="function1();"> </body> </html> 


     </source>


Line without noShade

   <source lang="html4strict">

<html> <body> <script language="JavaScript"> 

   function function1() {
       document.getElementById("myH").noShade = false
   }

</script>

<input type="button" value="Add a shade" onClick="function1();"> </body> </html> 


     </source>
Источник — «http://wbex.ru/index.php?title=JavaScript_DHTML/HTML/HR_Line&oldid=2613»