Web Analytics Made Easy -
StatCounter DHTML text displacement - CodingForum

Announcement

Collapse
No announcement yet.

DHTML text displacement

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • DHTML text displacement

    Is there a way to make a hidden DIV displace text when it is made visible?

    I want to make a page, a huge form really, with a several hidden sections, structured like this:

    [main form]
    [optional info 1]
    [optional info 2]
    [optional info 3]
    [additional info]
    [submit button]

    Each of the optional info's is contained in a DIV which is initially hidden, and which can be made visible with a "MORE>>" type javascript button located just before each DIV.

    I'd like to be able to hit the "MORE>>" button, and have all of the content below that button slide down the page to make room for the newly revealed DIV (rather than have a big blank spot, or have overlapping content). Is there any way to do this?

    Thanks!

  • #2
    You have to set the Display of the DIV to None,like this:
    Code:
    var x=document.getElementById("div_id");
    x.style.display="none";
    Then to show it ,set Display to nothing:

    Code:
    var x=document.getElementById("div_id");
    x.style.display="";

    Comment


    • #3
      Wonderful! That's just what I'm looking for.

      One thing, though: does it only work in IE? If so, are there other solutions for Netscape/Moz users?

      Thanks!

      Comment


      • #4
        It will work on any browser that supports the CSS display property - that includes Netscape 6+ and Mozilla.

        If your script doesn't work with those browser, check your code for IE-proprietary statements like "document.all".

        Comment


        • #5
          Originally posted by BrainJar
          It will work on any browser that supports the CSS display property - that includes Netscape 6+ and Mozilla.

          If your script doesn't work with those browser, check your code for IE-proprietary statements like "document.all".
          Initially setting the display property works in all browsers,but dynamically changing it doesn't work in Opera (as far as I know).It will work with NS6+/Mozilla and Konqueror

          Comment


          • #6
            Worked like a charm

            That works great! Thanks everybody!

            Comment

            Working...
            X