#137 new
Andrew

Effect.BlindDown IE6/7 bug

Reported by Andrew | December 17th, 2008 @ 05:51 AM

The problem is when you have a div that's position:relative inside of a table inside of a div that you want to display using Effect.BlindDown. The result is that the contents of the div appear blank.

Code:


<script language="JavaScript" type="text/JavaScript">
window.onload=function (){ Effect.BlindDown("test"); }
</script>

<div id='test' style='display:none'>
<table cellpadding='0' cellspacing='0' border='0'>
<tr>
<td>        
<div style='width:290px; height:84px; position:relative' align='center'>
  Test
</div>
</td>
</tr>
</table>
</div>

If you remove "position:relative" from the innermost div, it works, but the problem with that is then you cannot properly use position:absolute divs within that div.

Comments and changes to this ticket

  • Andrew

    Andrew December 17th, 2008 @ 05:52 AM

    the code sample didn't format correctly.

    
    <script language="JavaScript" type="text/JavaScript">
    window.onload=function (){ Effect.BlindDown("test"); }
    </script>
    
    <div id='test' style='display:none'>
    <table cellpadding='0' cellspacing='0' border='0'>
    <tr>
    <td>        
    <div style='width:290px; height:84px; ' align='center'>
      Test
    </div>
    </td>
    </tr>
    </table>
    </div>
    
  • Andrew

    Andrew December 17th, 2008 @ 06:12 AM

    the second bit of code is code that works.

    another bit of information: if you create an afterFinish function in the BlindDown to set the div to display:block, the contents instantly appear at that time.

    
    <script language="JavaScript" type="text/JavaScript">
    window.onload=function (){ Effect.BlindDown("test", {afterFinish: function(){
    $('test').style.display = "block";
    }); }
    </script>
    
  • George Adams

    George Adams December 22nd, 2008 @ 07:03 PM

    For me, this happens with any div, wherever it occurs in the layout.

Please Sign in or create a free account to add a new ticket.

With your very own profile, you can contribute to projects, track your activity, watch tickets, receive and update tickets through your email and much more.

New-ticket Create new ticket

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile ยป

script.aculo.us is an open-source JavaScript framework for visual effects and interface behaviours.
<br/><b>Source available from github</b>
The Git repository resides at:
<a href="http://github.com/madrobby/scriptaculous">http://github.com/madrobby/scriptaculous</a>
<br/>Check out the current development trunk with:
<code>git clone git://github.com/madrobby/scriptaculous.git</code>
<br/>As <b>script.aculo.us 1.xx is feature-frozen</b>, this development trunk is for <b>bugfixes only</b>.
<br/>New development should happen only for
<b>script.aculo.us 2</b>.
<br/><b>Creating a bug report</b>
When creating a bug report, be sure to include as much relevant information as possible. Post a an example that shows off the problem. Preferably, <b>alter the unit tests</b> and show through either changed or added tests how the expected behavior is not occuring.

People watching this ticket

Pages