www.webdeveloper.com
Results 1 to 2 of 2

Thread: Information display after clicking link

  1. #1
    Join Date
    Mar 2004
    Location
    Sunderland, UK
    Posts
    152

    Information display after clicking link

    Guys I am trying to make some web pages where if you link on a link from a series of links text will be shown underneath that link.

    I have seen this done somewhere else on the web and would really like to use this style.

    Each link will have this dropdown type effect displaying more information on each one once clicked. If clicked again the information will dissapear and if clicked on more than one the information for the links clicked will display.

    How can I do this in Javascript can you guyts point me in the right direction?

    Thanks Guys
    Gowans007

    Non Working Example follows:::


    <html>
    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    </head>

    <body>
    <table width="250" border="1" cellpadding="2" cellspacing="0" bordercolor="#000000">
    <tr>
    <td><a href="#"><strong>Link 1 </strong></a></td>
    </tr>
    <tr>
    <td><a href="#"><strong>Link 2 </strong></a></td>
    </tr>
    <tr>
    <td><a href="#"><strong>Link 3 </strong></a></td>
    </tr>
    <tr>
    <td><a href="#"><strong>Link 4 </strong></a></td>
    </tr>
    </table>

    <p>If clicked on a link text is displayed underneath i.e. </p>

    <table width="250" border="1" cellpadding="2" cellspacing="0" bordercolor="#000000">
    <tr>
    <td><a href="#"><strong>Link 1 </strong></a></td>
    </tr>
    <tr>
    <td><a href="#"><strong>Link 2 </strong></a><br>
    You have clicked on link 2 this information will be displayed here. </td>
    </tr>
    <tr>
    <td><a href="#"><strong>Link 3 </strong></a></td>
    </tr>
    <tr>
    <td><a href="#"><strong>Link 4 </strong></a></td>
    </tr>
    </table>

    </body>
    </html>

  2. #2
    Join Date
    Nov 2003
    Location
    Worthington, OH, USA
    Posts
    3,634
    You could try something like this:

    Code:
    ...
    <td><a href="#" onclick="document.getElementById('hTxt').style.display='inline'"><strong>Link 2 </strong></a><br>
    <span id="hTxt" style="display:none">You have clicked on link 2 this information will be displayed here.</span> </td>...
    54 68 65 42 65 61 72 4D 61 79

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles