slidedown() and table issue

Reported by:	cbad	Owned by:	cbad
Priority:	low	Milestone:	None
Component:	effects	Version:	1.7
Keywords:		Cc:
Blocked by:		Blocking:

Description

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!

Attachments (0)

Change History (8)

Changed November 08, 2011 03:19PM UTC by timmywil comment:1

component:	unfiled → effects
owner:	→ cbad
priority:	undecided → low
status:	new → pending
version:	→ 1.7

Thanks for taking the time to contribute to the jQuery project! Please provide a complete reduced test case on jsFiddle to help us assess your ticket.

Additionally, be sure to test against the jQuery Edge version to ensure the issue still exists. To get you started, use this boilerplate: http://jsfiddle.net/FrKyN/ Open the link and click to "Fork" (in the top menu) to get started.

Changed November 08, 2011 04:43PM UTC by cbad comment:2

status:	pending → new

I've put the code sample in jsfiddle and tested with jquery edge. Here's the link:

http://jsfiddle.net/3nXvm/

Thanks!

Changed November 08, 2011 09:19PM UTC by timmywil comment:3

http://jsfiddle.net/timmywil/3nXvm/2/

Changed November 09, 2011 05:43PM UTC by anonymous comment:4

Hey timmywil, does this require any action on my part?

Changed November 09, 2011 06:58PM UTC by timmywil comment:5

Nope, we just need to look into it further first. I haven't had time to yet.

Changed May 15, 2012 10:56AM UTC by sindresorhus comment:6

status:	new → open

Changed May 14, 2013 01:58AM UTC by BrodaNoel comment:7

_comment0:	Question: \ This bug is solved with the latest release. Whats is the next step fot this ticket? \ I'm a newbie. Sorry. → 1368496840466784

Question:

This bug is solved with the latest release. Whats is the next step fot this ticket?

The bug exist in the 1.7.x version (I try with 1.7.2 in jsfiddle).

I'm a newbie. Sorry.

Changed May 21, 2013 07:11AM UTC by m_gol comment:8

resolution:	→ fixed
status:	open → closed

Seems to work now.

Side navigation

#10710 closed bug (fixed)