HTML CSS Reference/CSS Attributes and Javascript Style Properties/overflow

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

"overflow" Example

   <source lang="html4strict">
   

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

   if(myBody.style.overflow=="auto"){
      myBody.style.overflow="scroll";
      myButton.value="Set overflow to hidden.";
      results.innerText="overflow is set to scroll.";
      return false;
   }
   if (myBody.style.overflow=="scroll"){
      myBody.style.overflow="hidden";
      myButton.value="Set overflow to auto";
      results.innerText="overflow is set to hidden.";
      return false;
   }
   if(myBody.style.overflow=="hidden"){
      myBody.style.overflow="auto";
      myButton.value="Set overflow to scroll";
      results.innerText="overflow is set to auto.";
      return false;
   } 

} </script> <body id="myBody" bottommargin="250" style="overflow:auto">

overflow is set to auto.


<input id=myButton type=button value="Set overflow to scroll" onclick="function1();"> </body> </html>


     </source>
   
  


"overflow" is applied to

   <source lang="html4strict">

+----------------+--------------------------------------------------------------+ | Applied_To |<a> <acronym> | | |<address> <applet> | | | |

| |
| | |<body>
|

| | | | |<col> <colgroup> | | |currentStyle <custom> | | |

defaults | | | |

| |<dir>
| | |
| | | <embed> | | |<fieldset> | | |<form> <hn> | | |<html> | | |<input type="button"> <input type="checkbox"> | | |<input type="file"> <input type="image"> | | |<input type="password"> <inputtype="radio"> | | |<input type="reset"> <input type="submit"> | | |<input type="text"> | | | <label> | | |<legend>
  • | | |<listing> <menu> | | |

      | | |

                                                            |
      |                |                                                    |
      |                |runtimeStyle                                               |
      |                |                                                 |
      |                |                                                |
      |                |                        style                         |
      |                |                                                    |
      |                |<textarea>                                                |
      |                |                             
        | | | <xmp> | +----------------+--------------------------------------------------------------+ </source>

        "overflow" Possible Values

        <source lang="html4strict"> Possible Values visible The default; the entire content is shown scroll Excess content is clipped and scroll bars are added hidden Excess content is clipped and scroll bars are not shown auto Excess content is clipped and scroll bars are added when necessary

        </source>



        "overflow" Syntax and Note

        <source lang="html4strict"> Note: How to deal with exceeded element content. This style is applicable to positioned elements only. Syntax:

        element { overflow: value } elementID.style.overflow = "value" document.all.elementID.style.overflow = "value" // IE only


        </source>