View Full Version : Show/Hide Element Help

05-06-2006, 12:25 PM
Ok here is my code:

At the moment it show's the text by defult what I want is it hides the text by deafult and when you click it shows the text

Any ideas on how I modify my code to do this?

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"

<html xmlns="http://www.w3.org/1999/xhtml">

<title> Project Diary</title>

<script language="Javascript">

function dispHandle(obj) {
if (obj.style.display == "none")
obj.style.display = "";
obj.style.display = "none";



<a href="javascript:dispHandle(vanisher)">Hide Show</a>
<div id=vanisher>Hello World!</div>


Bill Posters
05-06-2006, 12:43 PM
What's with that doctype?
Looks to me like you're using XHTML markup with little knowledge of what you're actually doing.
Your code is all over the place; missing some bits, misplacing others.
Your js appears as though you may only testing in the dreaded IE/Win, which is rarely a good idea.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Project Diary</title>
<script type="text/javascript">

window.onload = function() {



function dispHandle(objId) {

var obj = document.getElementById(objId);
obj.style.display = (obj.style.display == 'none') ? 'block' : 'none';



<a href="#" onclick="dispHandle('vanisher')">Hide Show</a>

<p id="vanisher">
Hello World!


The above method doesn't separate behaviour from presentation (it uses js to directly set style properties).
Still, I think you'd do well to get your head around this method before showing you how it should ideally be done.

Be sure to use the validator (http://validator.w3.org/detailed.html) to ensure that the code you're actually using is actually up to the quality it should be.

p.s. ditch the xml declaration/prologue until you're actually serving the markup as application/xhtml+xml.
If that statement goes over your head, then you're not ready yet.

05-06-2006, 01:29 PM
Yes, the main problem is that you do not use a correct reference of the object