[Resolvido] Menu Igual ao Mac em jQuery

[Editado: Oops, agora que eu vi que postei no local errado, moderadores, caso queiram mover meu tópico :P]

Bom dia pessoal, estou postando aqui pois minhas alternativas já se esgotaram, eu preciso criar um menu igual aquele do MAC OS, aqui vai um exemplo feito em jQuery: www.wizzud.com/jqDock/

Até ai tudo bem, eu encontrei dezenas de plugins prontos como este, porém 90% deles são feitos apenas com âncoras, e eu utilizo uma lista não ordenada, que "semântimante" é o correto, e não quero desfazer isso.

Meu Código:

<ul id="menu-footer">
 <li>
 <div class="ft-img-acesso"><a href="index.html" title="Página Inicial"><img src="icons/48/home.png" alt="Página Inicial" /></a></div>
 <div class="ft-titulo-acesso"><a href="index.html" title="Página Inicial">Página Inicial</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Consulta"><img src="icons/48/consulta.png" alt="Consulta" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Consulta</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Configurações"><img src="icons/48/configs.png" alt="Configurações" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Configurações</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Contatos"><img src="icons/48/contacts.png" alt="Contatos" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Contatos</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Ajuda (Help Desk)"><img src="icons/48/help-desk.png" alt="Ajuda (Help Desk)" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Ajuda</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Arquivos"><img src="icons/48/folder.png" alt="Arquivos" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Arquivos</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Busca Geral"><img src="icons/48/busca-geral.png" alt="Busca Geral" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Busca Geral</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Mensagens"><img src="icons/48/mensagens.png" alt="Mensagens" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Mensagens</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Fórum"><img src="icons/48/forum.png" alt="Fórum" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Fórum</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Notícias"><img src="icons/48/news.png" alt="Notícias" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Notícias</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Multimídia"><img src="icons/48/multimidia.png" alt="Multimídia" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Multimídia</a></div>
 </li>
 <li>
 <div class="ft-img-acesso"><a href="interna.html" title="Eventos"><img src="icons/48/events.png" alt="Eventos" /></a></div>
 <div class="ft-titulo-acesso"><a href="interna.html" title="Página Inicial">Eventos</a></div>
 </li>
 </ul>

Os 10% restantes não se encaixaram com o meu Layout, pois usam propriedades que desconfigurão meu Layout, foi então que eu pensei em fazer do zero.

Meu menu está dessa forma:

/applications/core/interface/imageproxy/imageproxy.php?img=http://www.fernandotholl.net/imagens/menu-footer.jpg&key=0069fdd40ad4eab521c7df43f17eaa7f0b97a165126e034ef7fcc9223113c0c9" alt="menu-footer.jpg" />

Meu código está assim:

/ Objetos /
var $MenuFooter = $('#menu-footer > li');

/ Menu Rodapé /
$MenuFooter.hover(

 function(){
 /* Aumentar a Imagem com efeito (Tipo fade...) */

 },
 function(){
 /* Diminuir a Imagem com efeito (Tipo fade...) */
 }
);

Estou fazendo com .hover, se estiver errado por favor me digam, porém estou parado na forma como fazer a animação, se alguém conseguir me ajudar nisso podemos evoluir com o tópico e fazer uma opção simples para esse menu.

Obrigado