Layout 2 colunas - jQuery

[Neri Junior 0]

Olá, fiz um layout com 2 colunas:

 

<div id="widget">
   <a href="#">Link</a>
   <ul class="hide">
	   Conteudo...
   </ul>
</div>
<div id="conteudo">
   <p>
	   Conteudo...
   </p>
</div>

CSS:

#widget{ width: 42%; }
#conteudo{ width: 42% }

Quando clicar no elemento " a " do " #widget "

$('#widget a').click(function(){
	$(this).parent.find('ul.hide:visible').animate({'height':'hide'}, 'slow');
	$(this).parent.find('ul.hide:hidden').animate({'height':'hide'}, 'slow');
})

Até ai beleza, agora como faço por exemplo quando esconder a UL (.hide) ele diminuir a WIDTH da Div(#widget) para 5% e almentar da DIV (#conteudo) para 90%?

 

Obrigado!

[Neri Junior 0]

Desculpa o flood mas, ninguem pode me ajudar?