problems with buttons

problems with buttons

Hello im new at jquery ive tryed to design buttons with an animation of rollover, 
here is the script that i used
i need to know is there something wrong with the script
thanks 
Marcos
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>botonera</title>

<script language="javascript">
$(document).ready(function () {
$('#vinculo a').mouseover(function () {
$(this).animate({
backgroundPosition: '150px'
});
}, "slow");
$('#vinculo a').mouseout(function () {
$(this).animate({
backgroundPosition: '300px'
});
}, "slow");
});

</script>

<style>
body
{
background:#333;
}
ul li 
{
list-style:none;
float:left;
}
ul li a:link, ul li a:visited
{
background: url(images/botonfondo.png);
display: block;
width:150px;
height:70px;
text-decoration:none;
color: #FFF;
font-weight: bold;
font-size:18px;
text-align:center;
vertical-align:middle;
}
</style>
</head>

<body>
<ul id="vinculo">
<li><a href="#">INICIO</a></li>
    <li><a href="#">QUIENES SOMOS</a></li>
    <li><a href="#">CONTACTENOS</a></li>
</body>
</html>