Ora bem… então vamos lá dar continuidade às dicas de Jquery, prometi algumas dicas e tenho andado a falhar como as notas de 50€.

Mas em frente, a ideia hoje é demonstrar como fazer um menu animado em Jquery:

JS:

1
2
3
4
5
6
7
8
$(document).ready(function() {
    $('ul.anim_queue_exemplo a')
        .hover(function() {
            $(this).animate({ left: 20 }, 'fast');
        }, function() {
            $(this).animate({ left: 0 }, 'fast');
        });
});

HTML:

1
2
3
4
5
6
7
<ul class="anim_queue_exemplo">
<li><a href="#">Menu Item Um</a></li>
<li><a href="#">Menu Item Dois</a></li>
<li><a href="#">Menu Item Três</a></li>
<li><a href="#">Menu Item Quatro</a></li>
<li><a href="#">Menu Item Cinco</a></li>
</ul>

… não esquecer de inserir a chamada ao jquery.js dentro da head.

Abraço,