jquery animate не работает должным образом

Question

im пытается анимировать ширину таблицы, поэтому содержимое становится «закрытым» и «открытым». Поэтому я манипулирую правой и левой щели:

$(".gaps").animate({width:"35%"},'slow', function(){  
    $(".gaps").animate({width: "10%"},'slow'); 
    $("#content").fadeIn(); 
    }); 

но как-то не его анимационный линейный. Первые 10% до 35% работают отлично, но ширина начинается с более чем 100 в начале 10% -анимации, поэтому контент прыгает. Я пробовал некоторые вещи, такие как «width:» - = 25% «», но даже это не сработало. У меня есть другие проблемы, разве я не вижу очевидного?

Спасибо!

Answer 1

Чтобы закончить это я добавлю ответ от комментариев:

Извините, но таблицы просто не ведут себя хорошо, когда дело доходит до оживляющих размеров. В зависимости от того, что вы пытаетесь сделать, вы можете поместить таблицу в div: внутренний с статическим размером и внешним переполнением ширины: скрытый, а затем попытаться анимировать внешний.

<div style="overflow:hidden; background:red;" class="animateMe"> 
    <div style="width:300px;"> 
     <table>...</table> 
    </div> 
</div> 

http://jsfiddle.net/mgwo9axL