JavaScript Forum

**davidt_28** · 08-09-2006, 03:39 PM

Hello
I recently published this question to the php forum, as I believed the script I needed to identify was .php. However I have since been informed that it is in fact javaScript.
I am developing my first website and I came across something that I would like to implement. They appear to be hidden text boxes. An example can be found here: Forex Calendar @ Forex Factory
If you click on 'read' you will see what I am talking about. I would like to learn how to scrip these hidden boxes but I have no idea what the technical name is for this method so I can't do any research. If anybody could shed some light it would be much appreciated.
Thanks
Dave

**mastercomputers** · 08-10-2006, 08:52 AM

Here's an example of how to do something similar:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-NZ">
  <head>
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />
    <title>Javascript Hide/Unhide Elements</title>
    <script type="text/javascript">
    /*<![CDATA[*/
      function toggleMessage(obj) {
        var sibling = null;
        if(obj.nextSibling.nodeType == 3)
          sibling = obj.nextSibling.nextSibling;
        else
          sibling = obj.nextSibling;
        sibling.style.display = (sibling.style.display == 'block') ? 'none' : 'block';
        return false;
      }
    /*]]>*/
    </script>
  </head>
  <body>
    <div>
      [<a href="" title="If it fails you might want to send them to a page at least?" onclick="javascript:toggleMessage(this);">Read More…</a>]
      <p style="display: none;">This was not displaying but as you have clicked the link, it now appears.</p>
    </div>
  </body>
</html>

I didn't look at how that site above does it, but it shouldn't be too different, but it could work on element ids, this just works on the sibling elements, works for IE and FF.

Cheers,

MC