97ldave 97ldave - 1 year ago 95
jQuery Question

slideToggle() on <tr> causes "jump"

When using jQuery

function to show/hide data on a new row in a table it causes it to stutter. Yet, when using
to show/hide a
it works very smoothly.

Can anyone tell me why this happens?

Fiddle example: http://jsfiddle.net/gLGUG/

jQuery code:

$("tr").click(function () {

$(".slideMeDiv, button").click(function () {

HTML Markup:

<td>One Row</td>
<td>Click me</td>
<tr class="slideMe">
<br />
<button>Slide Div</button>

<div class="slideMeDiv">
Slide me as well

Answer Source

Mention the border="0" cellspacing="0" cellpadding="0" in the table

<table width="100%" border="0" cellspacing="0" cellpadding="0">

this will solve the jumping issue

Here is the jsFiddle File

Also for sliding effect you need to wrap your text with a div and place the div in-side the td

here is the updated jsFiddle File

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download