Results 1 to 6 of 6

Thread: Animated Collapsible DIV v2.4 collapsing issue

  1. #1
    Join Date
    Mar 2012
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Animated Collapsible DIV v2.4 collapsing issue

    1) Script Title: Animated Collapsible DIV v2.4

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...edcollapse.htm

    3) Describe problem: Can't restore the window height to its original height after collapsing.
    Installed the code and works just fine. I have all DIVs collapsed as the default. I added inside one of the divs a link that once the mouse hovers over it, it displays a table (lets call it TABLE). I used the code of "Image w/ description tooltip" at http://www.dynamicdrive.com/dynamici...agetooltip.htm for displaying the TABLE
    The problem occurs only when I expand a DIV and hover over the link, mentioned above, then I click to collapse the DIV. The DIV collapses but it doesn't restore the window's height to its original size (before expanding). So I end up with blank space at the bottom ofthe DIVs. This doesn't happen if I expand the DIV and collapse it with out hovering over the link.
    After testing I found that once "tipcss.top" is set to a value (see function positionTip(evt)) and the value is within the view area, the code belongs to Animated Collapse doesn't restore the window's height to its original size, as it was before the DIV was expanded. I tracked the values of both "window.pageYOffset" and "document.body.scrollTop". Once the DIV is expanded their value increased according to how much is expanded. At Collapsing their values gets restored to the original as long as I don't hover over the link. If I did hover over the link, then their values don't get restored to their original value as it was before expanding, regardless of the height of the TABLE

  2. #2
    Join Date
    Aug 2004
    Posts
    10,140
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Please post a link to the page on your site that contains the problematic script so we can check it out.
    DD Admin

  3. #3
    Join Date
    Mar 2012
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Collapse issues

    Here it is: http://www.rampart-tech.com/temp.html

    At the bottom of the second div is a link to hover the mouse over. Try expanding and collapsing the DIV without hovering over the link, then try it again with hover over the link then collapsing. You will see the windows height was not restored

  4. #4
    Join Date
    Mar 2012
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I posted your request
    Thank you

  5. #5
    Join Date
    Aug 2004
    Posts
    10,140
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    I've checked out your webpage. The tooltip script doesn't actually appear to be Image w/ Description Tooltip. Regardless, the issue seems to be that you've set the position of the tooltip DIV to "fixed" instead of "absolute". First, modify the position of the DIV by swapping out "fixed" below with "absolute":

    Code:
    <div id="tip2Div" style="position: absolute; visibility: hidden; z-index: 100; border-width: 4px; padding: 0px; border-style: solid; border-radius: 8px 8px 8px 8px; width: 450px; font-family: Verdana,arial,helvetica,sans-serif; font-size: 8pt; color: rgb(0, 0, 0); background-color: white; border-color: black;"></div>
    Then, inside the script for the tooltip, add the line in red to the existing code below:

    Code:
    function hideTip() {
    	  if (!tooltip2) {return;}
    		tip2css.top=0;
    	  t4=setTimeout("tip2css.visibility='hidden'",100);
    	  tip2On = false;
    }
    That should do it.
    DD Admin

  6. #6
    Join Date
    Mar 2012
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Sure thing, it did the magic.
    I am using two tooltip which I got from "Image w/ Description Tooltip." back in 2002, but I had to modify one of the tooltip to fit my project specs.
    Thank you

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
  •