I am fasinated by hiding and unhiding web contents. Have seen some web site doing the above. When you check a checkbox called "More Info", more web contents will be displayed on the same page below the checkbox. When you uncheck "More Info" checkbox, previously displayed web contents will be hidden. New to web programming. Do I need javascript to do this or just HTML can do? Thanks.
Where can I find the javascript to achieve this hide/unhide web contents? Appreciate if you can point me to the right direction Thanks.
You need javascript. Have a look at this. http://www.dynamicdrive.com/dynamicindex16/formdependency.htm But there are some problems with it. It only hides the content within the label tags so to hide the text and the field you have to use the following code. <label for="test">test<input type="text" name="test" value="value" /></label> Code (markup): Unfortunately this is not how the label tags are meant to be used. They are meant to be used like this. <label for="test">test</label><input type="text" name="test" value="value" /> Code (markup): which means that you can't apply css styles to them. To overcome this problem, just use find and replace in the javascript file so that it hides from with in the parent div rather then then parent label. Just search for "label" and replace with "div" then place a div outside the content you wish to hide. The final result should look like this. <div><label for="test">test</label><input type="text" name="test" value="value" /></div> Code (markup): Which will hide everything with in the parent div tags.
You will need both html and javascript. Think of html as the car and javascript being the engine. Here's an example of how you could achieve this; You can visit http://www.w3schools.com/js/default.asp for more uses of javascript.