www.webdeveloper.com
+ Reply to Thread
Results 1 to 13 of 13
  1. 11-22-2002 11:44 AM #1
    screamingbuddha
    screamingbuddha is offline Registered User
    Join Date
    Nov 2002
    Posts
    13

    resolved [RESOLVED] visible/invisible div's

    could use some help here, sorry to have to ask for this kind of load

    I have 2 elements that will be displayed on a page depending on a cookie status.
    One element is a form, the other is a table structure.

    I haven't used DHTML in some time, and I remember that you could use z-index to determine which one would be displayed - in this case:

    var Status == getCookieValue(myCookie)
    if Status = "taken"
    {
    /* table containing results, information, etc.. */
    }
    else
    {
    /* form and submit button */

    I don't think z-index is still the most effecient, or easiest way to do this.. is there a more current method?
    Last edited by screamingbuddha; 11-25-2002 at 08:56 AM.
    ____
    n00b
    Reply With Quote Reply With Quote
  2. 11-22-2002 11:46 AM #2
    Zach Elfers
    Zach Elfers is offline Registered User
    Join Date
    Nov 2002
    Posts
    631
    I don't know what you mean, but you can hide divs etc., but putting display:none; in the CSS script.
    Reply With Quote Reply With Quote
  3. 11-22-2002 11:58 AM #3
    gil davis's Avatar
    gil davis
    gil davis is offline Nobody important
    Join Date
    Nov 2002
    Posts
    4,473
    The "z-index" parameter detemines the stacking order of positioned objects that are overlapping. It is used to bring an object to the front of another object without changing the visibility of either object.

    The "display" parameter detemines how an object is displayed in the flow of the document: "inline", "block" or "none". It is used to expand and collapse things, like an outline or menu.

    The "visiblilty" parameter determies whether an object is visible or not: "visible", "hidden" or "inherit". It is used to selectively show and hide portions of a document.
    Reply With Quote Reply With Quote
  4. 11-22-2002 12:13 PM #4
    screamingbuddha
    screamingbuddha is offline Registered User
    Join Date
    Nov 2002
    Posts
    13
    ok I think I understand a little better..
    can you help me write it out, or point to an example?
    (I know my syntax is bad.. corrections and flames welcome)


    var Status == getCookieValue(myCookie)
    if Status = "taken";
    {
    (id=Poll style="visibility: hidden")
    (id=Results style="visibility: visible")
    }
    else
    {
    (id=Poll style="visibility: visible")
    (id=Results style="visibility: hidden")
    }

    <body>

    <table><tr>

    <div id="Poll">
    <td>poll</td>
    <td>info</td>
    <td>submit</td>
    </div>

    </tr><tr>

    <div id="Results">
    <td>results</td>
    <td>info</td>
    </div>

    </tr></table>

    this is the nature of what I have to produce.. sorry I'm no good at this
    ____
    n00b
    Reply With Quote Reply With Quote
  5. 11-22-2002 12:33 PM #5
    gil davis's Avatar
    gil davis
    gil davis is offline Nobody important
    Join Date
    Nov 2002
    Posts
    4,473
    Originally posted by screamingbuddha
    (id=Poll style="visibility: hidden")
    (id=Results style="visibility: visible")
    Code:
    {document.getElementById("Poll").style.visibility = "hidden";
 document.getElementById("Rusults").style.visibility = "visible";}
    You should be able to figure out the rest.
    Reply With Quote Reply With Quote
  6. 11-22-2002 12:59 PM #6
    screamingbuddha
    screamingbuddha is offline Registered User
    Join Date
    Nov 2002
    Posts
    13
    Gil you think too highly of me..
    can I get a code check
    here where I'm testing this?

    thanks
    ____
    n00b
    Reply With Quote Reply With Quote
  7. 11-22-2002 01:35 PM #7
    gil davis's Avatar
    gil davis
    gil davis is offline Nobody important
    Join Date
    Nov 2002
    Posts
    4,473
    My best advice would be to get a working cookie script. Yours isn't.
    Reply With Quote Reply With Quote
  8. 11-22-2002 01:42 PM #8
    screamingbuddha
    screamingbuddha is offline Registered User
    Join Date
    Nov 2002
    Posts
    13
    I'd been working with this script previously.. and it seemed to work just fine (commented out what I added, and it didn't show any errors)
    what platform/browser are you running?
    ____
    n00b
    Reply With Quote Reply With Quote
  9. 11-22-2002 03:28 PM #9
    gil davis's Avatar
    gil davis
    gil davis is offline Nobody important
    Join Date
    Nov 2002
    Posts
    4,473
    (heavy sigh)

    I used IE 5.5 on Windows 2000.

    Your getCookieValue() function does not seem to return the cookie correctly. I couldn't debug the page any further, and gave up. Perhaps someone with more patience with cookie scripts and such will pick up this thread.
    Reply With Quote Reply With Quote
  10. 11-22-2002 04:18 PM #10
    screamingbuddha
    screamingbuddha is offline Registered User
    Join Date
    Nov 2002
    Posts
    13
    (shaking my head in shame)

    I'm sorry Gil, I'm new here and certainly didn't mean to cause such a reaction within days of registering..

    for anyone else with patience remaining.. I've updated the cookieScript to something seemingly more stable.
    The original problem still remains, I need only one of the div's visible based on the conditional.
    here
    ____
    n00b
    Reply With Quote Reply With Quote
  11. 11-22-2002 05:01 PM #11
    gil davis's Avatar
    gil davis
    gil davis is offline Nobody important
    Join Date
    Nov 2002
    Posts
    4,473
    Well, I looked at your latest, and you have cleaned up the cookie crumbs.

    I can now see your logic problems.

    You cannot change the visibility of an object until it exists. You need to make both divs "hidden" by default. Then in an "onLoad" script, act accordingly.

    Add the visible decisions to the existing "onLoad" script. This stuff:

    <script language="javascript">
    GetCookie('pollStatus')
    {
    if (GetCookie('pollStatus') == null)
    {
    SetCookie('pollStatus','untaken', exp);
    }
    if (GetCookie('pollStatus') == 'untaken')
    {
    //document.getElementById("pollResults").style.visibility = "hidden";
    //document.getElementById("pollQuestion").style.visibility = "visible";
    }
    else
    {
    //document.getElementById("pollQuestion").style.visibility = "hidden";
    //document.getElementById("pollResults").style.visibility = "visible";
    }
    }
    </script>
    Put it in a function and get rid of the first cookie call (not necessary, doesn't do anything) and the first set of braces. Call the function somewhere in the "onLoad".

    Change the "div" styles, either inline or using a style sheet. For example (using the ID's so you can change the type of tag if you want):

    <style>
    .pollQuestion {visibility: hidden}
    .pollResults {visibility: hidden}
    </style>
    Reply With Quote Reply With Quote
  12. 11-22-2002 07:36 PM #12
    screamingbuddha
    screamingbuddha is offline Registered User
    Join Date
    Nov 2002
    Posts
    13
    thanks very much!
    (labor fruits updated)

    sb
    ____
    n00b
    Reply With Quote Reply With Quote
  13. 08-19-2003 10:02 PM #13
    conma2cang
    conma2cang is offline Registered User
    Join Date
    Aug 2003
    Posts
    2
    i want to use onclick to show/hide tables...

    but i want the setting show/hide to be remembered .. so that when the user reloads the page... the setting is still there...


    how do i use the codes above then?

    plz explain to me a little more!

    thx
    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

Thread Information

Users Browsing this Thread

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

     

Bookmarks

Posting Permissions

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

Forum Rules

 HTML5 Development Center



Recent Articles