id,summary,reporter,owner,description,type,status,priority,milestone,component,version,resolution,keywords,cc,blocking,blockedby
10710,slidedown() and table issue,cbad,cbad,"Looks like the height for a <td> is calculated at a pre-determined width when formatting text and used to determine height to slide down. When the slide down occurs, it slides smoothly to the calculated width and then snaps to the real height (can be either up or down depending). Here's a simple example:


{{{
<!DOCTYPE HTML PUBLIC ""-//W3C//DTD HTML 4.01 Transitional//EN"">
<html>
  <head>
    <title></title>
    <meta http-equiv=""Content-Type"" content=""text/html; charset=UTF-8"">
<script type=""text/javascript"" src=""http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js""></script>
<script>
$(document).ready( function() {

		
		$('tr td').each(function(index, item) {
			$(item).html($(item).html()+'<p style=""display: none;"">'+$(item).attr('title'))+'</p>';
			$(item).removeAttr('title');
		});

		$('tr td').click( function(event){
			$this = $(this);

			if ( $this.hasClass('open') ) {$this.children('p').slideUp('slow');} else {$this.children('p').slideDown('slow');}
			$this.toggleClass('open');
		});
});
</script>
  </head>
  <body>

	<table width=""800"">
		<tr>
			<td title=""Now is the time for all good men to come to the aid of their country, Now is the time for all good men to come to the aid of their country, Now is the time for all good men to come to the aid of their country"">
				<h4>Click to Expand One</h4>
			</td>
		</tr>
		<tr>
			<td title=""Now is the time for all good men to come to the aid of their country"">

				<h4>Click to Expand Two</h4>
			</td>
		</tr>
	</table>



  </body>
</html>
}}}

In this example, if the browser window is wide enough it slides smoothly. If the width of the window is reduced, it will slide down too far (but smoothly), and then snap up.

Thanks!
",bug,open,low,None,effects,1.7,,,,,
