• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 16. Dynamic HTML: Changing Web P... > Setting Element Visibility On-the-Fl...

Setting Element Visibility On-the-Fly

Another way to make the elements in your pages dynamic is by using the visibility style property, which you can set to "visible" or "hidden" to show or hide elements. Here’s an example that does exactly that, showing or hiding some text when the user clicks a button:

(Listing 16-10.html on the web site)

<HTML> 
    <HEAD> 
        <TITLE> 
            Making elements visible using the visibility property 
        </TITLE> 

        <SCRIPT LANGUAGE="JAVASCRIPT"> 
            <!--
            function showAll()
					{
					document.getElementById("div1").style.visibility = "visible"
					} 
            //--> 
        </SCRIPT> 
    </HEAD> 

    <BODY> 
        <H1> 
            Making elements visible using the visibility property 
        </H1> 

        <FORM NAME="form1"> 
            <INPUT TYPE="BUTTON" VALUE="Click Me" ONCLICK="showAll()"> 
            <BR> 
            <BR> 
            <DIV ID="div1" STYLE="visibility:hidden">
					Here’s some additional text! 
            </DIV> 
        </FORM> 
    </BODY> 
</HTML> 

					  


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint