Revealing hidden html text

Discussion in 'Javascript' started by Andrew, Dec 5, 2003.

  1. Andrew

    Andrew Guest

    I have a <div> section of text in my page that I want to make visible
    via an input check box associated with an OnClick javascript.
    I can do this OK but the problem is that the space for the hidden text
    is reserved on the page (i.e. thare is a gap). The user clicks the
    button to make the text visible or not visible.
    What I really want is for the page to expand (open up) to reveal the
    text if the user checks the box and contracts again if the box is
    unchecked. Much neater.
    Here are the important bits of the code so far :-

    <style type="text/css">.hidden { position: relative; visibility:
    hidden; }</style>

    .............

    <SCRIPT LANGUAGE="JavaScript">

    function set(What,Value)
    {

    if (document.layers && document.layers[What] != null)
    document.layers[What].visibility = Value;
    else
    if (document.all)
    eval('document.all.'+What+'.style.visibility ="'+ Value+'"');
    }

    function click1(Form,Radio,Layer)
    {
    vv = "visible"
    hh = "hidden"
    if (Form.C1.checked)
    {set(Layer,vv);}
    else
    { set(Layer,hh);}
    }
    </SCRIPT>

    ...........

    <td align="left" valign="top" width="100%"><input type="checkbox"
    name="C1" onClick="click1(this.form,this.name,'L1')" value="OFF"><div
    class="hidden" id="L1"><ul><li>xxx</li><li>yyy</li></ul></div></td>


    Can you help?
    Thanks.
     
    Andrew, Dec 5, 2003
    #1
    1. Advertising

  2. Andrew

    Fabian Guest

    Andrew hu kiteb:

    > I have a <div> section of text in my page that I want to make visible
    > via an input check box associated with an OnClick javascript.
    > I can do this OK but the problem is that the space for the hidden text
    > is reserved on the page (i.e. thare is a gap). The user clicks the
    > button to make the text visible or not visible.
    > What I really want is for the page to expand (open up) to reveal the
    > text if the user checks the box and contracts again if the box is
    > unchecked. Much neater.
    > Here are the important bits of the code so far :-
    >
    > <style type="text/css">.hidden { position: relative; visibility:
    > hidden; }</style>


    use the display stylesheet attribute instead of visibility. That way,
    screen space is not reserved for the object.



    --
    --
    Fabian
    Visit my website often and for long periods!
    http://www.lajzar.co.uk
     
    Fabian, Dec 5, 2003
    #2
    1. Advertising

  3. Andrew

    Andrew Guest

    Can you expand a little on display stylesheet attribute - not familiar.

    Thanks.
     
    Andrew, Dec 7, 2003
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Rick
    Replies:
    3
    Views:
    8,479
    Alexey Smirnov
    Apr 13, 2010
  2. Marco Krechting

    Get text from SELECT into hidden text?

    Marco Krechting, Jan 9, 2005, in forum: ASP General
    Replies:
    5
    Views:
    198
    Aaron [SQL Server MVP]
    Jan 10, 2005
  3. Michael Hill

    revealing content

    Michael Hill, Jul 22, 2004, in forum: Javascript
    Replies:
    2
    Views:
    82
    Michael Hill
    Jul 22, 2004
  4. PeP
    Replies:
    3
    Views:
    175
  5. SolarCanine
    Replies:
    2
    Views:
    320
    SolarCanine
    Sep 20, 2005
Loading...

Share This Page